Front-end application building method and system based on service function combination

Abstract

The invention provides a business function combination-based front-end application building method and system, and the method comprises the steps: obtaining script parameters inputted in a command line interface, the command line interface being a CLI tool created by a scaffold built through a Node.js platform in advance by using a Commander library; the script parameters comprise a service packet combination identifier and a site address; and triggering the scaffold to obtain a corresponding target npm service packet according to the service packet combination identifier and the site address, the target npm service packet including a product npm service packet and a customized function npm service packet, and generating a front-end application according to the target npm service packet through the scaffold. Through a command line interaction mode, a simple and efficient project building mode is provided, the project starting time and development cost are reduced, the standard product npm service package and the customization function npm service package are freely combined according to the input script parameters to achieve rapid customization development of the front-end application, and the personalized requirements of different clients are met.

Description

Technical Field

[0001] The present invention relates to the field of application development technology, and in particular to a front-end application building method and system based on business function combination. Background Art

[0002] With the development of mobile Internet, enterprises have an increasing demand for rapid development and deployment of mobile applications. The existing development model often requires a lot of manual configuration and code writing, which is not only time-consuming and labor-intensive, but also difficult to adapt to changing business needs. Currently, for different business scenarios, it is often necessary to develop application codes specific to the business scenario to meet the corresponding business needs, resulting in the inability to improve development efficiency. Summary of the invention

[0003] The embodiment of the present invention provides a front-end application construction method and system based on business function combination to solve the problems existing in the related technologies. The technical solution is as follows:

[0004] In a first aspect, an embodiment of the present invention provides a front-end application construction method based on business function combination, including:

[0005] Get the script parameters entered in the command line interface. The command line interface is a CLI tool created by using the commander library through the scaffolding built on the Node.js platform in advance; the script parameters include the business package combination identifier and the site address;

[0006] The trigger scaffold obtains the corresponding target npm business package according to the business package combination identifier and the site address. The target npm business package includes the product npm business package and the customized function npm business package, and generates a front-end application according to the target npm business package through the scaffold.

[0007] In one implementation, the command line interface displays a command guide statement to guide the user to input script parameters, and the script parameters also include a template type.

[0008] In one embodiment, it further includes:

[0009] The trigger scaffold pulls the corresponding project template from the server according to the template type. The project template provides basic functional modules for the generation of front-end applications. The functional modules include user module, login module, and permission module.

[0010] In one embodiment, it further includes:

[0011] Get the product business function code and package it into a product npm business package;

[0012] Create and edit a json file, and determine the package information of the product npm business package based on the json file. The package information contains detailed information describing the npm business package and instructions for configuring the project;

[0013] Store the product npm business package and its package information on the server.

[0014] In one embodiment, it further includes:

[0015] Trigger the scaffolding to use the sie-cli createPage command to create a customized business function module, generate a customized function npm business package based on the business function module, and upload it to the server.

[0016] In one implementation, the method for generating the service package combination identifier is:

[0017] Identify the selection action when the user selects the corresponding product npm business package and the corresponding custom function npm business package, and determine the user code, the timestamp corresponding to the selection action, and the version number of the selected npm business package according to the selection action;

[0018] Generate a service package combination identifier based on the user code, timestamp and version number.

[0019] In one embodiment, generating a front-end application according to a target npm business package through a scaffold includes:

[0020] Get the JSON tree structure of the target npm business package, and parse the JSON tree structure through the scaffolding to get the package information;

[0021] Create a corresponding directory structure based on the package information through scaffolding, and integrate the code and resources in the target npm business package into the directory structure according to the instructions in the JSON tree structure;

[0022] Generate the front-end application according to the directory structure through the build command provided by the scaffolding.

[0023] In a second aspect, an embodiment of the present invention provides a front-end application building system based on business function combination, which executes the front-end application building method based on business function combination as described above.

[0024] In a third aspect, an embodiment of the present invention provides an electronic device, the device comprising: a memory and a processor. The memory and the processor communicate with each other through an internal connection path, the memory is used to store instructions, the processor is used to execute the instructions stored in the memory, and when the processor executes the instructions stored in the memory, the processor executes the method in any one of the above-mentioned embodiments.

[0025] In a fourth aspect, an embodiment of the present invention provides a computer-readable storage medium, which stores a computer program. When the computer program runs on a computer, the method in any one of the above-mentioned embodiments is executed.

[0026] The advantages or beneficial effects of the above technical solution include at least:

[0027] The present invention uses the Node.js platform to build a scaffold named sie-cli, uses the commander library to build a command line interface, provides an operation interface for users through the command line interface, and users can input script parameters through the command line interface, pull corresponding npm business packages according to the script parameters, and generate front-end applications according to the npm business packages through the scaffold. The present invention provides a concise and efficient project building method through command line interaction, reduces project startup time and development costs, and freely combines standard product npm business packages and customized function npm business packages according to input script parameters to achieve rapid customized development of front-end applications to meet the personalized needs of different customers.

[0028] The above summary is for illustrative purposes only and is not intended to be limiting in any way. In addition to the illustrative aspects, embodiments and features described above, further aspects, embodiments and features of the present invention will be readily apparent by reference to the accompanying drawings and the following detailed description. BRIEF DESCRIPTION OF THE DRAWINGS

[0029] In the accompanying drawings, unless otherwise specified, the same reference numerals throughout the multiple drawings represent the same or similar parts or elements. These drawings are not necessarily drawn to scale. It should be understood that these drawings only depict some embodiments disclosed in the present invention and should not be regarded as limiting the scope of the present invention.

[0030] Figure 1 A flow chart of a front-end application construction method based on a business function combination according to the present invention;

[0031] Figure 2 is a schematic diagram of a command line interface of the present invention;

[0032] Figure 3 A schematic diagram of the framework of a front-end application building system based on a business function combination of the present invention;

[0033] Figure 4 A schematic diagram of the process of pulling the npm package of the present invention and creating a front-end application;

[0034] Figure 5 The structure block diagram of an electronic device according to an embodiment of the present invention. DETAILED DESCRIPTION

[0035] In the following, only some exemplary embodiments are briefly described. As those skilled in the art will appreciate, the described embodiments may be modified in various ways without departing from the spirit or scope of the present invention. Therefore, the drawings and descriptions are considered to be exemplary and non-restrictive in nature.

[0036] With the development of mobile Internet, enterprises have an increasing demand for rapid development and deployment of mobile applications. The existing development model often requires a lot of manual configuration and code writing, which is not only time-consuming and labor-intensive, but also difficult to adapt to changing business needs.

[0037] In order to solve the above problems, an embodiment of the present invention proposes a front-end application construction method based on business function combination, which can improve development efficiency, reduce development costs, and can flexibly adapt to different business scenarios.

[0038] like Figure 1 , Figure 3 As shown, this embodiment provides a front-end application construction method based on business function combination, which specifically includes the following steps:

[0039] Step S1: Acquire script parameters input in the command line interface, where the command line interface is a CLI tool created by using the commander library through a scaffolding pre-built on the Node.js platform.

[0040] Specifically, this embodiment uses the Node.js platform to build a scaffold named sie-cli, uses the commander library to build a command line interface, and provides a user-friendly operation interface.

[0041] It should be noted that Node.js is a JavaScript runtime environment based on the Chrome V8 engine, which allows developers to run JavaScript code on the server side; various types of back-end services and command line tools can be created using the Node.js platform.

[0042] Scaffolding is an auxiliary tool used to quickly generate the infrastructure and code of a project so that developers can quickly start development based on it. Scaffolding usually contains some templates and automated scripts for creating project files and directories, installing dependencies, etc.

[0043] The commander library is a Node.js library for building command line interface (CLI) applications.

[0044] A command line interface (CLI) is a user interface that allows users to interact with a computer program through the command line, allowing the user to enter commands and parameters to execute program functions.

[0045] In this embodiment, Figure 2 As shown, the command line interface displays command guide statements to guide the user to enter script parameters. The command statements include "Please select your project template", "Please enter your project name", "Please output your appcode", "Please enter your site", etc. The user enters the corresponding script parameters in the command line interface according to the command guide statements; wherein, the script parameters include the template type of the project template, project name, appcode, site address, etc.

[0046] It should be noted that appcode is also called the business package combination identifier, which refers to a unique identifier generated by combining multiple business packages. The program will pull the combined business package from the server through the business package combination identifier and parse the package information to generate the corresponding front-end application.

[0047] Step S2: trigger the scaffolding to obtain the corresponding target npm business package according to the business package combination identifier and the site address, the target npm business package includes the product npm business package and the customized function npm business package, and generate the front-end application according to the target npm business package through the scaffolding.

[0048] It should be noted that the target npm business package is formed by dynamically combining product npm business packages and customized function npm business packages according to user needs.

[0049] Specifically, users can check the required product npm business packages and the required customized function npm business packages from the system according to their needs, identify the user's selection actions during the checking process, determine the type and quantity of business packages selected by the user, and determine the checked product npm business packages and the checked customized function npm business packages as target npm business packages.

[0050] At the same time, the user's identity information is identified, and the user code representing the user's unique identity is determined based on the identity information; the timestamp when the user performs the selection action and the version number of the target npm business package selected by the user are identified; a unique business package combination identifier is generated based on the user code, timestamp, and version number of the target npm business package, and the type of business package combined by the user can be determined through the business package combination identifier. The scaffolding initiates a request through the axios library based on the business package combination identifier to pull the corresponding multiple business packages from the server to obtain a data set containing business package information.

[0051] It should be noted that axios is a popular JavaScript library for making HTTP requests in web browsers or Node.js.

[0052] Among them, the method for generating the product npm business package is:

[0053] Obtain product business function codes, obfuscate them and encapsulate them into product npm business packages. The obfuscated codes are difficult to read and understand directly, which protects the security of the codes to a certain extent.

[0054] Users create and edit the package.json file according to the specific needs of the project, and determine the package information of the product npm business package based on the package.json file. The package information refers to the content in the package.json file. The package information provides structured data for the project through the package.json file; specifically, the package information describes the function name, icon, route, package name, package reference address and other information;

[0055] Upload the product npm business package to the server and write the package information to the corresponding database of the server.

[0056] In addition, the method for generating a customized function npm business package is:

[0057] Trigger the scaffolding to run the sie-cli createPage command to create the basic directory structure of the customized business function module, run npminit to create the package.json file, and fill in the basic information of the customized business function module, such as package name, version, description, etc.;

[0058] The scaffolding automatically creates corresponding product line directories based on the product lines entered by the user (i.e., different business modules or function sets in the project), and creates corresponding module entry files under the corresponding product line directories based on the module names entered by the user. Once the directories and entry files are created, users can start writing specific business logic codes in these files to develop module functions of customized business function modules, and run customized business function modules in the local environment to ensure that customized business function modules work as expected.

[0059] After creating a custom business function module, package it into a custom function npm business package, and upload the custom function npm business package to the server so that it can be reused and shared in other projects.

[0060] like Figure 4 As shown, in this embodiment, after the script parameters are entered, the scaffolding will pull the corresponding product npm business package and the customized function npm business package from the server according to the business package combination identifier and the site address, and trigger the scaffolding to pull the corresponding project template from the server according to the template type. The project template provides basic configuration information for the generation of the front-end application; then the front-end application is generated according to the target npm business package through the scaffolding.

[0061] Among them, the purpose of pulling project templates is to adapt to different business scenarios. Different projects may have different business requirements, such as e-commerce platforms, social networks or enterprise management systems. The project template provides an infrastructure for the front-end application, including the layout of files and directories, which is the skeleton of the front-end project. The project template contains some basic functional modules, such as user modules, login modules, permission modules, etc. The project template can preset different functional modules, components and configurations according to the template type selected by the user, thereby reducing the initial setup work of the developer and accelerating the development process; this embodiment can ensure that the generated front-end project is adapted to the specific business scenario by pulling a specific project template.

[0062] The method for generating a front-end application according to a target npm business package through a scaffold in this embodiment is:

[0063] Get the JSON tree structure of the target npm business package, parse the JSON tree structure through the scaffolding to get the package information, and then get the package name, version, dependency, script, configuration and other key information;

[0064] The scaffolding automatically creates the corresponding directory structure based on the package information, and integrates the code and resources in the target npm business package into the directory structure according to the instructions in the JSON tree structure;

[0065] The scaffold automatically runs npminstall or yarn to install the dependencies listed in package.json and configures the development environment according to the package information;

[0066] Once the project's directory structure and dependencies are installed, users can start writing code based on business needs, use the build commands provided by the scaffolding (such as npm run build) to build a production version of the front-end application based on the functions and components provided by the target npm business package, and deploy the built front-end application to the server for use.

[0067] This embodiment uses the Node.js platform to build a scaffold named sie-cli, and uses the commander library to build a command line interface. The command line interface provides an operation interface for users, and users can input script parameters through the command line interface. That is, this embodiment provides a simple and efficient project building method through command line interaction, which reduces project startup time and development costs; in addition, this embodiment pulls the corresponding npm business package according to the script parameters, and generates a front-end application according to the npm business package through the scaffold, which is equivalent to freely combining standard product npm business packages and customized function npm business packages according to the input script parameters to achieve rapid customized development of front-end applications to meet the personalized needs of different customers; and this embodiment prevents source code leakage and improves the security of project interaction by introducing business packages instead of source code.

[0068] Another embodiment of the present invention provides a front-end application building system based on business function combination, which executes the front-end application building method based on business function combination as described above.

[0069] The functions of each module in the system of the embodiment of the present invention can refer to the corresponding description in the above method, which will not be repeated here.

[0070] Another embodiment of the present invention provides an electronic device, Figure 5 FIG. 2 shows a structural block diagram of an electronic device according to an embodiment of the present invention. Figure 5 As shown, the electronic device includes: a memory 100 and a processor 200, and the memory 100 stores a computer program that can be run on the processor 200. When the processor 200 executes the computer program, the front-end application building method based on the business function combination in the above embodiment is implemented. The number of the memory 100 and the processor 200 can be one or more.

[0071] The electronic device also includes:

[0072] The communication interface 300 is used to communicate with external devices and perform data exchange transmission.

[0073] If the memory 100, the processor 200 and the communication interface 300 are implemented independently, the memory 100, the processor 200 and the communication interface 300 can be connected to each other through a bus and communicate with each other. The bus can be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. The bus can be divided into an address bus, a data bus, a control bus, etc.

[0074] Optionally, in a specific implementation, if the memory 100, the processor 200 and the communication interface 300 are integrated on a chip, the memory 100, the processor 200 and the communication interface 300 can communicate with each other through an internal interface.

[0075] An embodiment of the present invention provides a computer-readable storage medium storing a computer program, which implements the method provided in the embodiment of the present invention when executed by a processor.

[0076] An embodiment of the present invention further provides a chip, which includes a processor for calling and executing instructions stored in the memory from the memory, so that a communication device equipped with the chip executes the method provided by the embodiment of the present invention.

[0077] An embodiment of the present invention also provides a chip, including: an input interface, an output interface, a processor and a memory, wherein the input interface, the output interface, the processor and the memory are connected via an internal connection path, and the processor is used to execute the code in the memory. When the code is executed, the processor is used to execute the method provided by the embodiment of the invention.

[0078] It should be understood that the processor may be a central processing unit (CPU), or other general-purpose processors, digital signal processors (DSP), application specific integrated circuits (ASIC), field programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. The general-purpose processor may be a microprocessor or any conventional processor, etc. It is worth noting that the processor may be a processor supporting the advanced RISC machines (ARM) architecture.

[0079] Further, optionally, the above-mentioned memory may include a read-only memory and a random access memory, and may also include a non-volatile random access memory. The memory may be a volatile memory or a non-volatile memory, or may include both volatile and non-volatile memories. Among them, the non-volatile memory may include a read-only memory (ROM), a programmable read-only memory (PROM), an erasable programmable read-only memory (EPROM), an electrically erasable programmable read-only memory (EEPROM), or a flash memory. The volatile memory may include a random access memory (RAM), which is used as an external cache. By way of example but not limitation, many forms of RAM are available. For example, static RAM (SRAM), dynamic random access memory (DRAM), synchronous DRAM (SDRAM), double data rate synchronous dynamic random access memory (DDR SDRAM), enhanced synchronous dynamic random access memory (ESDRAM), synchronous link dynamic random access memory (SLDRAM) and direct rambus RAM (DR RAM).

[0080] In the above embodiments, it can be implemented in whole or in part by software, hardware, firmware or any combination thereof. When implemented using software, it can be implemented in whole or in part in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, the process or function according to the present invention is generated in whole or in part. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable device. The computer instructions can be stored in a computer-readable storage medium, or transmitted from one computer-readable storage medium to another computer-readable storage medium.

[0081] In the description of this specification, the description with reference to the terms "one embodiment", "some embodiments", "example", "specific example", or "some examples" means that the specific features, structures, materials or characteristics described in conjunction with the embodiment or example are included in at least one embodiment or example of the present invention. Moreover, the specific features, structures, materials or characteristics described may be combined in any one or more embodiments or examples in a suitable manner. In addition, those skilled in the art may combine and combine different embodiments or examples described in this specification and the features of different embodiments or examples, unless they are contradictory.

[0082] In addition, the terms "first" and "second" are used for descriptive purposes only and should not be understood as indicating or implying relative importance or implicitly indicating the number of the indicated technical features. Therefore, the features defined as "first" and "second" may explicitly or implicitly include at least one of the features. In the description of the present invention, the meaning of "plurality" is two or more, unless otherwise clearly and specifically defined.

[0083] The above is only a specific embodiment of the present invention, but the protection scope of the present invention is not limited thereto. Any person skilled in the art can easily think of various changes or substitutions within the technical scope disclosed by the present invention, which should be included in the protection scope of the present invention. Therefore, the protection scope of the present invention should be based on the protection scope of the claims.

Claims

1. A front-end application construction method based on business function combination, characterized in that: include: Obtaining script parameters input in a command line interface, wherein the command line interface is a CLI tool created in advance by using a scaffolding built on a Node.js platform and a commander library; the script parameters include a business package combination identifier and a site address; The scaffold is triggered to obtain a corresponding target npm business package according to the business package combination identifier and the site address, wherein the target npm business package includes a product npm business package and a customized function npm business package, and a front-end application is generated according to the target npm business package through the scaffold.

2. The front-end application construction method based on business function combination according to claim 1 is characterized in that: The command line interface displays a command guide statement to guide the user to input the script parameters, and the script parameters also include a template type.

3. The front-end application construction method based on business function combination according to claim 2 is characterized in that: Also includes: The scaffold is triggered to pull the corresponding project template from the server according to the template type. The project template provides a basic functional module for the generation of the front-end application. The functional module includes a user module, a login module, and a permission module.

4. The front-end application construction method based on business function combination according to claim 1 is characterized in that: Also includes: Obtain the product business function code, and encapsulate the product business function code into a product npm business package; Create and edit a json file, and determine the package information of the product npm business package according to the json file, wherein the package information includes detailed information for describing the npm business package and instructions for configuring items; The product npm business package and its package information are stored in the server.

5. The front-end application construction method based on business function combination according to claim 1 is characterized in that: Also includes: The scaffold is triggered to use the sie-cli createPage command to create a customized business function module, and a customized function npm business package is generated according to the business function module and uploaded to the server.

6. The front-end application construction method based on business function combination according to claim 1 is characterized in that: The method for generating the business package combination identifier is: Identify the selection action of the user when checking the corresponding product npm business package and the corresponding custom function npm business package, and determine the user code, the timestamp corresponding to the selection action, and the version number of the selected npm business package according to the selection action; The service package combination identifier is generated according to the user code, the timestamp and the version number.

7. The front-end application construction method based on business function combination according to claim 1 is characterized in that: Generating a front-end application according to the target npm business package through the scaffolding includes: Obtain the JSON tree structure of the target npm business package, and parse the JSON tree structure through the scaffold to obtain package information; Creating a corresponding directory structure according to the package information through the scaffolding, and integrating the code and resources in the target npm business package into the directory structure according to the instructions in the JSON tree structure; The front-end application is generated according to the directory structure through the build command provided by the scaffold.

8. A front-end application building system based on business function combination, characterized in that: Execute the front-end application construction method based on business function combination as described in any one of claims 1 to 7.

9. An electronic device, characterized in that: include: A processor and a memory, wherein the memory stores instructions, and the instructions are loaded and executed by the processor to implement the front-end application construction method based on business function combination as described in any one of claims 1 to 7.

10. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the front-end application building method based on business function combination as described in any one of claims 1 to 7 is implemented.

Images