Front-end scaffolding rapid construction method and system based on modular design

Through the rapid construction method of front-end scaffolding based on modular design, the problem of lack of flexibility in front-end scaffolding tools and insufficient support for project follow-up development and maintenance in the existing technology is solved, and higher development efficiency and project quality are achieved.

CN118444884BActive Publication Date: 2025-02-25WORLDCOM HENGQI (BEIJING) TECH CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202410535073.4
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2024-04-30
Publication Date
2025-02-25
Estimated Expiration
2044-04-30

AI Technical Summary

Technical Problem

The existing front-end scaffolding tools lack flexibility and cannot meet the personalized needs of different developers. They also lack support for the subsequent development and maintenance of projects, resulting in the inability to effectively improve development efficiency and project quality.

Method used

Using a front-end scaffolding fast construction method based on modular design, by storing multiple predefined modules in the module library, each module contains specific source code files and configuration files, developers can select required modules according to their needs and use automation. module selection, assembly and project generation process to generate front-end projects.

Benefits of technology

It improves the development efficiency and quality of front-end projects, provides higher flexibility, supports the subsequent development and maintenance of the project, and overcomes the problems of lack of flexibility in front-end scaffolding tools in the existing technology and insufficient support for the subsequent development and maintenance of the project.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN118444884B_ABST
    Figure CN118444884B_ABST
Patent Text Reader

Abstract

The present disclosure provides a method and system for quickly building a front-end scaffold based on modular design, the method comprising storing a plurality of predefined modules in a module library, wherein each module comprises a specific source code file and a configuration file; selecting a required module from the module library; processing the integration and dependency relationship between the selected modules; and generating a front-end project according to the processing result, wherein the front-end project comprises the source code file and configuration file of the selected module, the basic structure of the project, and the required tool configuration. The present disclosure uses modular design, so that developers can select the required modules according to their needs, providing higher flexibility, and also providing support for the subsequent development and maintenance of the project, overcoming the problems of the lack of flexibility and insufficient support for the subsequent development and maintenance of the project in the prior art of the front-end scaffolding tools.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the technical field of front-end development, and in particular to a method and system for quickly building a front-end scaffold based on modular design. Background Art

[0002] With the development of Internet technology, the complexity of front-end development continues to increase, and developers need to spend a lot of time on environment configuration, module management, etc. Although existing front-end development tools can provide some help, they still cannot meet the needs of fast and efficient development.

[0003] Existing front-end scaffolding tools, such as Create React App and Vue CLI, can help developers quickly create projects, but these tools usually only provide a fixed project structure and configuration and lack flexibility. If developers need to use different technology stacks or customize project structures, they need to manually modify the generated projects, which is time-consuming and error-prone. In addition, existing front-end scaffolding tools usually only focus on the initialization phase of the project and provide insufficient support for subsequent development and maintenance of the project. For example, if developers need to add new modules during project development, they need to manually create files and write code, which is not only inefficient but also easily leads to a chaotic project structure.

[0004] In summary, the problems and shortcomings of the existing technology are as follows: First, the existing front-end scaffolding tools lack flexibility and cannot meet the personalized needs of different developers; second, the existing front-end scaffolding tools do not provide sufficient support for the subsequent development and maintenance of the project, and cannot effectively improve the development efficiency and project quality. Therefore, it is urgent to provide a method for quickly building a front-end scaffolding to overcome the above-mentioned defects of the existing technology. Summary of the invention

[0005] In view of this, the purpose of the present invention is to overcome the problems of lack of flexibility of front-end scaffolding tools in the prior art and insufficient support for subsequent project development and maintenance, and to provide a front-end scaffolding rapid construction method and system based on modular design to improve the development efficiency and quality of front-end projects.

[0006] Based on the above objectives, the present disclosure provides a method for quickly building a front-end scaffold based on modular design, comprising:

[0007] A plurality of predefined modules are stored in the module library, wherein each module includes a specific source code file and a configuration file;

[0008] Select a desired module from the module library;

[0009] Handle the integration and dependencies between selected modules;

[0010] A front-end project is generated according to the processing result, wherein the front-end project includes source code files and configuration files of the selected module, a basic project structure, and required tool configurations.

[0011] In one embodiment, processing the integration and dependency relationships between selected modules includes:

[0012] Get the dependency library configuration file of the selected module;

[0013] Read the dependency library configuration files of all modules to get the dependencies of each module;

[0014] Summarize all dependencies and deduplicate them based on the dependency names.

[0015] In one embodiment, generating a front-end project according to the processing result includes:

[0016] Temporarily create a directory, and create a project configuration file and module directory under the directory;

[0017] Copy the module's dependencies after dependency deduplication processing to the project configuration file, and copy the module's source code file to the module directory;

[0018] Create a basic project structure and copy the contents of the project configuration file and the module directory to the basic project structure.

[0019] In one embodiment, generating a front-end project according to the processing result further includes:

[0020] Import all modules into the created project basic structure and register them globally.

[0021] In one embodiment, all modules are introduced into the created basic project structure and registered globally, including:

[0022] Open the project entry file in the project basic structure, import all modules in the project entry file and register them globally.

[0023] In one of the embodiments, the required tool configuration is added during the process of creating the basic structure of the project.

[0024] Based on the same inventive concept, the present disclosure also proposes a front-end scaffolding rapid construction system based on modular design, including:

[0025] A module storage device, which is used to store a plurality of predefined modules in a module library, wherein each module includes a specific source code file and a configuration file;

[0026] A module selector, which is used to select a desired module from the module library;

[0027] A module assembler, which is used to handle the integration and dependencies between selected modules;

[0028] A project generator is used to generate a front-end project according to the processing results, wherein the front-end project includes the source code files and configuration files of the selected modules, the basic structure of the project and the required tool configuration.

[0029] In one of the embodiments, the module selector has a visual interface, and all modules predefined in the module library are displayed on the visual interface.

[0030] Based on the same inventive concept, the present disclosure also proposes an electronic device, including a memory, a processor, and a computer program stored in the memory and executable on the processor. When the processor executes the program, the method for quickly building a front-end scaffolding based on modular design described in the above embodiment is implemented.

[0031] Based on the same inventive concept, the present disclosure also proposes a non-transitory computer-readable storage medium, which stores computer instructions, and the computer instructions are used to enable a computer to execute the front-end scaffolding rapid construction method based on modular design described in the above embodiment.

[0032] From the above, it can be seen that the front-end scaffolding rapid construction method based on modular design provided by the present disclosure can provide higher flexibility through modular design, and also provide support for subsequent development and maintenance of the project, overcoming the problems of lack of flexibility and insufficient support for subsequent development and maintenance of the project in the prior art front-end scaffolding tools. The present disclosure greatly improves the development efficiency of the front-end project through automated module selection, assembly and project generation processes. BRIEF DESCRIPTION OF THE DRAWINGS

[0033] In order to more clearly illustrate the technical solutions in the present disclosure or related technologies, the drawings required for use in the embodiments or related technical descriptions are briefly introduced below. Obviously, the drawings described below are only embodiments of the present disclosure. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.

[0034] Figure 1 A schematic diagram of a process for quickly constructing a front-end scaffold based on a modular design according to an embodiment of the present disclosure;

[0035] Figure 2 A flowchart of step S30 provided in an embodiment of the present disclosure;

[0036] Figure 3 A flowchart of step S40 provided in an embodiment of the present disclosure;

[0037] Figure 4 A schematic diagram of the hardware structure of a front-end scaffolding rapid construction system based on modular design provided in one embodiment of the present disclosure;

[0038] Figure 5 A schematic diagram of the hardware structure of an electronic device provided in another embodiment of the present disclosure. DETAILED DESCRIPTION

[0039] In order to make the objectives, technical solutions and advantages of the present disclosure more clearly understood, the present disclosure is further described in detail below in combination with specific embodiments and with reference to the accompanying drawings.

[0040] It should be noted that, unless otherwise defined, the technical terms or scientific terms used in the embodiments of the present disclosure should be understood by people with ordinary skills in the field to which the present disclosure belongs. The "first", "second" and similar words used in the embodiments of the present disclosure do not indicate any order, quantity or importance, but are only used to distinguish different components. "Including" or "comprising" and similar words mean that the elements or objects appearing before the word cover the elements or objects listed after the word and their equivalents, without excluding other elements or objects. "Connect" or "connected" and similar words are not limited to physical or mechanical connections, but can include electrical connections, whether direct or indirect. "Up", "down", "left", "right" and the like are only used to indicate relative positional relationships. When the absolute position of the described object changes, the relative positional relationship may also change accordingly.

[0041] Reference Figure 1 As shown, an embodiment of the present disclosure provides a method for quickly building a front-end scaffold based on a modular design, the method comprising the following steps:

[0042] Step S10: storing a plurality of predefined modules in a module library, wherein each module includes a specific source code file and a configuration file;

[0043] Step S20: Select a required module from the module library;

[0044] Step S30: Processing the integration and dependency relationships between the selected modules;

[0045] Step S40: Generate a front-end project according to the processing result, wherein the front-end project includes source code files and configuration files of the selected module, a basic project structure, and required tool configurations.

[0046] The present invention provides a method for quickly building a front-end scaffolding based on modular design. Through modular design, developers can choose the required modules according to their needs, which provides higher flexibility and also provides support for subsequent development and maintenance of the project, overcoming the problems of lack of flexibility and insufficient support for subsequent development and maintenance of the project in the prior art front-end scaffolding tools.

[0047] In step S10, the present embodiment stores a variety of predefined modules in the module library, each module including a set of source code files and configuration files for specific functions, such as a module for user authentication, a module for data management, and a module for interface layout.

[0048] In this embodiment, the concept of module library can greatly improve the reusability and maintainability of source code files. By encapsulating source code files and configuration files of specific functions in modules, developers can use and combine these modules more conveniently, thereby speeding up development. For example, for a user authentication module, it may contain source code files and configuration files for related functions such as login, registration, and password management; a data management module may involve source code files and configuration files for related functions such as database connection, data operation, and data verification; an interface layout module can handle the layout, style, and interaction of a page.

[0049] The modular design of this embodiment also helps the organization and management of source code files, making the entire system more clearly structured. When a function needs to be modified or expanded, only the corresponding module needs to be operated without affecting the code of other parts.

[0050] Among them, in step S20, this embodiment can select the required modules according to the actual needs of the project. Compared with the existing front-end scaffolding tools, the present disclosure uses modular design, and developers can select the required modules according to their own needs, thereby creating a project that meets their own needs, providing higher flexibility.

[0051] Among them, refer to Figure 2 As shown, in step S30, this embodiment processes the integration and dependency relationship between the selected modules, specifically including the following steps:

[0052] Step S301: Obtain the dependency library configuration file of the selected module;

[0053] Step S302: Read the dependency library configuration files of all modules to obtain the dependencies of each module;

[0054] Step S303: Summarize all dependencies and deduplicate dependencies based on the dependency names.

[0055] As an example, in step S302, the dependency library configuration file package.json of all modules is read by nodejs. In this embodiment, the dependency library configuration files of the modules are read and summarized and deduplicated to ensure that no duplicate dependencies appear in the project.

[0056] This embodiment can easily obtain the dependency information in the package.json file of each module through the file reading function provided by nodejs; then perform deduplication operation according to the name of the dependency, which can avoid introducing duplicate dependencies in the project, reduce possible conflicts and problems, and ensure that the final dependencies do not have duplicate dependencies. This processing method can improve the stability and maintainability of the project and ensure the accuracy of dependency management. Moreover, the deduplicated dependency list is also easier to manage and update.

[0057] Among them, refer to Figure 3 As shown, in step S40, this embodiment generates a front-end project according to the processing result, which specifically includes the following steps:

[0058] Step S401: temporarily create a directory, and create a project configuration file and module directory under the directory;

[0059] Step S402: copying the dependencies of the module after dependency deduplication processing to the project configuration file, and copying the source code file of the module to the module directory;

[0060] Step S403: Create a basic project structure, introduce all modules into the created basic project structure and register them globally, and copy the contents of the project configuration file and the module directory into the basic project structure.

[0061] In step S403, all modules are introduced into the created basic structure of the project and are globally registered, including opening the project entry file in the basic structure of the project, introducing all modules into the project entry file and globally registering them.

[0062] As an example, in step S401, this embodiment temporarily creates a directory temp through node, and creates a file package.json and a directory modules in the directory. This organization method helps to keep the files neat and orderly, and facilitates subsequent processing and use. The package.json file can record the relevant information and dependencies of the processed module, and the modules directory can store the specific source code files of the module. In step S402, the dependencies of the module after the dependency deduplication processing are copied to the package.json file and saved through the nodejs file operation method, and the source code files of all modules are copied to the modules directory and saved through the nodejs file operation method. In step S403, the basic structure of the project is created through the vue-cli tool. In this process, you can choose which tools to add, such as es line, prettier, etc.; then in the basic structure of the project, open the project entry file main.js through the nodejs file operation method, introduce all modules and register them globally (as components), so that all modules can be used globally in the project; then copy the content of the package.json file to the package.json file in the basic structure of the project, and copy the module es directory to the src directory of the basic structure of the project.

[0063] This disclosure not only focuses on the initialization phase of the project, but also provides support for the subsequent development and maintenance of the project. Through modular design, developers can add or delete modules at any time during the project development process without manually creating files and writing code. This greatly improves development efficiency while keeping the project structure clear and consistent.

[0064] The present disclosure adopts modular design, and each module can be tested and maintained separately, which can improve the stability and maintainability of the project and reduce the occurrence of errors and bugs. At the same time, modular design also promotes code reuse and component development, and improves the scalability and maintainability of the project.

[0065] The present disclosure greatly improves the development efficiency of front-end projects by automating the module selection, assembly and project generation process. Developers do not need to manually handle the dependencies between modules and the basic structure of the project, saving a lot of time and energy.

[0066] This disclosure allows developers to customize according to their own needs. Developers can select the required modules, customize the project structure and configuration, and thus create a front-end project that meets their own needs.

[0067] The following is a detailed description of a method for quickly building a front-end scaffolding based on a modular design provided by the present invention through specific practical operations.

[0068] As an example, the specific operation of the present disclosure is as follows:

[0069] Step 1: Predefine multiple modules in the module library. Each module mainly includes the module's dependency library configuration file package.json and the module's source code file.

[0070] Step 2: Select one or more modules based on your project requirements.

[0071] Step 3: According to the module selected by the user in step 2, obtain the dependency library configuration file package.json of all modules.

[0072] Step 4: Use node to temporarily create a directory temp, and create a file package.json and a directory modules in this directory.

[0073] Step 5: Read the dependency library configuration file package.json of all modules by using nodejs to read files, summarize all dependencies, and then deduplicate dependencies based on dependency names to ensure that there are no duplicate dependencies in the final dependencies.

[0074] Step 6: Use nodejs to operate files, copy the dependencies processed in step 5 to the package.json file in step 4 and save it.

[0075] Step 7: Use nodejs to operate files, copy the source code files of all modules to the modules directory in step 4 and save them.

[0076] Step 8: Use the vue-cli tool to create the basic structure of the project. During this process, you can choose which tools to add, such as es line, prettier, etc.

[0077] Step 9: In the basic project structure generated in step 8, open the project entry file main.js through the nodejs file operation method, import all modules into it and register them globally (as components), so that all modules can be used globally in the project.

[0078] Step 10: Copy the contents of the package.json file in step 6 to the package.json file of the basic project structure generated in step 8.

[0079] Step 11: Copy the module es directory in step 7 to the src directory of the project basic structure generated in step 8.

[0080] The present disclosure greatly improves the development efficiency of front-end projects through automated module selection, assembly and project generation processes.

[0081] It should be noted that the method of the embodiment of the present disclosure can be performed by a single device, such as a computer or a server. The method of the present embodiment can also be applied in a distributed scenario and completed by multiple devices cooperating with each other. In the case of such a distributed scenario, one of the multiple devices can only perform one or more steps in the method of the embodiment of the present disclosure, and the multiple devices will interact with each other to complete the described method.

[0082] It should be noted that the above describes some embodiments of the present disclosure. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recorded in the claims can be performed in an order different from that in the above embodiments and still achieve the desired results. In addition, the processes depicted in the accompanying drawings do not necessarily require the specific order or continuous order shown to achieve the desired results. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0083] Based on the same inventive concept, corresponding to any of the above-mentioned embodiment methods, the present disclosure also provides a front-end scaffolding rapid construction system based on modular design.

[0084] Reference Figure 4 As shown, a front-end scaffolding rapid construction system based on modular design in this embodiment includes:

[0085] A module storage device, which is used to store a plurality of predefined modules in a module library, wherein each module includes a specific source code file and a configuration file;

[0086] A module selector, which is used to select a desired module from the module library;

[0087] A module assembler, which is used to handle the integration and dependencies between selected modules;

[0088] A project generator is used to generate a front-end project according to the processing results, wherein the front-end project includes the source code files and configuration files of the selected modules, the basic structure of the project and the required tool configuration.

[0089] The front-end scaffolding rapid construction system based on modular design provided by the present invention can provide higher flexibility through modular design, and also provide support for subsequent development and maintenance of the project, thus overcoming the problems of lack of flexibility and insufficient support for subsequent development and maintenance of the project in the prior art front-end scaffolding tools.

[0090] The module memory of this embodiment is used to store a variety of predefined modules in the module library, each module including a set of source code files and configuration files for specific functions, such as modules for user authentication, modules for data management, and modules for interface layout, etc.

[0091] In this embodiment, the concept of module library can greatly improve the reusability and maintainability of source code files. By encapsulating source code files and configuration files of specific functions in modules, developers can use and combine these modules more conveniently, thereby speeding up development.

[0092] The module selector of this embodiment has a visual interface, which displays all predefined modules in the module library, and the required modules can be selected according to the actual needs of the project. Compared with the existing front-end scaffolding tools, the present disclosure adopts a modular design, and developers can select the required modules according to their own needs, thereby creating a project that meets their own needs, providing higher flexibility.

[0093] The module assembler of this embodiment is used to easily obtain the dependency information in the package.json file of each module through the file reading function provided by nodejs; then deduplication is performed according to the name of the dependency, which can avoid introducing duplicate dependencies in the project, reduce possible conflicts and problems, and ensure that the final dependencies do not have duplicate dependencies. This processing method can improve the stability and maintainability of the project and ensure the accuracy of dependency management. Moreover, the deduplicated dependency list is also easier to manage and update.

[0094] The project generator of this embodiment is used to temporarily create a directory, create a project configuration file and a module directory under the directory; copy the dependencies of the module after dependency deduplication processing to the project configuration file, and copy the source code file of the module to the module directory; create a basic project structure, introduce all modules into the created basic project structure and perform global registration, and copy the contents in the project configuration file and the module directory to the basic project structure.

[0095] This disclosure allows developers to customize according to their own needs. Developers can select the required modules, customize the project structure and configuration, and thus create a front-end project that meets their own needs.

[0096] For the convenience of description, the above system is described by dividing the functions into various system modules. Of course, when implementing the present disclosure, the functions of each system module can be implemented in the same or multiple software and / or hardware.

[0097] The system of the above-mentioned embodiment is used to implement the corresponding front-end scaffolding rapid construction method based on modular design in any of the above-mentioned embodiments, and has the beneficial effects of the corresponding method embodiments, which will not be repeated here.

[0098] Based on the same inventive concept, corresponding to any of the above-mentioned embodiments, the present disclosure also provides an electronic device, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein when the processor executes the program, the method for quickly building a front-end scaffolding based on modular design as described in any of the above embodiments is implemented.

[0099] Figure 5 A more specific schematic diagram of the hardware structure of an electronic device provided in this embodiment is shown, and the device may include: a processor 1010, a memory 1020, an input / output interface 1030, a communication interface 1040, and a bus 1050. The processor 1010, the memory 1020, the input / output interface 1030, and the communication interface 1040 are connected to each other through the bus 1050 in the device.

[0100] The processor 1010 can be implemented by a general-purpose CPU (Central Processing Unit), a microprocessor, an application-specific integrated circuit (ASIC), or one or more integrated circuits, and is used to execute relevant programs to implement the technical solutions provided in the embodiments of this specification.

[0101] The memory 1020 may be implemented in the form of ROM (Read On ly Memory), RAM (Random Access Memory), static storage device, dynamic storage device, etc. The memory 1020 may store an operating system and other application programs. When the technical solutions provided in the embodiments of this specification are implemented by software or firmware, the relevant program codes are stored in the memory 1020 and are called and executed by the processor 1010.

[0102] The input / output interface 1030 is used to connect the input / output module to realize information input and output. The input / output module can be configured in the device as a component (not shown in the figure), or it can be externally connected to the device to provide corresponding functions. The input device may include a keyboard, a mouse, a touch screen, a microphone, various sensors, etc., and the output device may include a display, a speaker, a vibrator, an indicator light, etc.

[0103] The communication interface 1040 is used to connect a communication module (not shown) to realize communication interaction between the device and other devices. The communication module can realize communication through a wired mode (such as USB, network cable, etc.) or a wireless mode (such as mobile network, WI FI, Bluetooth, etc.).

[0104] The bus 1050 includes a path that transmits information between the various components of the device (eg, the processor 1010, the memory 1020, the input / output interface 1030, and the communication interface 1040).

[0105] It should be noted that, although the above device only shows the processor 1010, the memory 1020, the input / output interface 1030, the communication interface 1040 and the bus 1050, in the specific implementation process, the device may also include other components necessary for normal operation. In addition, it can be understood by those skilled in the art that the above device may also only include the components necessary for implementing the embodiments of the present specification, and does not necessarily include all the components shown in the figure.

[0106] The electronic device of this embodiment is used to implement the corresponding front-end scaffolding rapid construction method based on modular design in any of the aforementioned embodiments, and has the beneficial effects of the corresponding method embodiments, which will not be repeated here.

[0107] Based on the same inventive concept, corresponding to any of the above-mentioned embodiment methods, the present disclosure also provides a non-transitory computer-readable storage medium, wherein the non-transitory computer-readable storage medium stores computer instructions, and the computer instructions are used to enable the computer to execute the front-end scaffolding rapid construction method based on modular design as described in any of the above embodiments.

[0108] The computer-readable medium of this embodiment includes permanent and non-permanent, removable and non-removable media, and information storage can be implemented by any method or technology. Information can be computer-readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technology, read-only compact disk read-only memory (CD-ROM), digital versatile disk (DVD) or other optical storage, magnetic cassettes, magnetic tape magnetic disk storage or other magnetic storage devices or any other non-transmission media that can be used to store information that can be accessed by a computing device.

[0109] The computer instructions stored in the storage medium of the above embodiment are used to enable the computer to execute the method for quickly building a front-end scaffolding based on modular design as described in any of the above embodiments, and have the beneficial effects of the corresponding method embodiments, which will not be repeated here.

[0110] Those skilled in the art should understand that the discussion of any of the above embodiments is merely illustrative and is not intended to imply that the scope of the present disclosure (including the claims) is limited to these examples. Based on the concept of the present disclosure, the technical features in the above embodiments or different embodiments may be combined, the steps may be implemented in any order, and there are many other variations of the different aspects of the embodiments of the present disclosure as described above, which are not provided in detail for the sake of simplicity.

[0111] In addition, to simplify the description and discussion, and in order not to make the embodiments of the present disclosure difficult to understand, the known power / ground connections to the integrated circuit (IC) chips and other components may or may not be shown in the provided figures. In addition, the device can be shown in the form of a block diagram to avoid making the embodiments of the present disclosure difficult to understand, and this also takes into account the fact that the details of the implementation of these block diagram devices are highly dependent on the platform on which the embodiments of the present disclosure will be implemented (that is, these details should be fully within the scope of understanding of those skilled in the art). Where specific details (e.g., circuits) are set forth to describe exemplary embodiments of the present disclosure, it is apparent to those skilled in the art that the embodiments of the present disclosure can be implemented without these specific details or with changes in these specific details. Therefore, these descriptions should be considered illustrative rather than restrictive.

[0112] Although the present disclosure has been described in conjunction with specific embodiments of the present disclosure, many replacements, modifications and variations of these embodiments will be apparent to those skilled in the art from the foregoing description. For example, other memory architectures (e.g., dynamic RAM (DRAM)) may use the embodiments discussed.

[0113] The embodiments of the present disclosure are intended to cover all such substitutions, modifications and variations that fall within the broad scope of the appended claims. Therefore, any omissions, modifications, equivalent substitutions, improvements, etc. made within the spirit and principles of the embodiments of the present disclosure should be included in the scope of protection of the present disclosure.

Claims

1. A method for quickly building a front-end scaffold based on modular design, characterized in that: include: A plurality of predefined modules are stored in the module library, wherein each module includes a specific source code file and a configuration file; Select a desired module from the module library; Handle the integration and dependencies between selected modules; Generate a front-end project according to the processing result, wherein the front-end project includes source code files and configuration files of the selected module, a basic project structure, and required tool configurations; Handle integration and dependencies between selected modules, including: Get the dependency library configuration file of the selected module; Read the dependency library configuration files of all modules to get the dependencies of each module; Summarize all dependencies and deduplicate them based on the dependency names; Generate a front-end project based on the processing results, including: Temporarily create a directory, and create a project configuration file and module directory under the directory; Copy the module's dependencies after dependency deduplication processing to the project configuration file, and copy the module's source code file to the module directory; Create the basic project structure and copy the contents of the project configuration file and the module directory to the basic project structure; Use node to temporarily create a directory temp, and create a file package.json and a directory modules in the directory. The package.json file can record the relevant information and dependencies of the processed module, while the modules directory stores the specific source code files of the module. Use nodejs to operate files, copy the dependencies of the module that has been deduplicated to the package.json file and save it, and use nodejs to operate files, copy the source code files of all modules to the modules directory and save them; Use the vue-cli tool to create the basic structure of the project. In this process, choose to add tools. Then, in the basic structure of the project, open the project entry file main.js by operating the file in nodejs, introduce all modules and register them globally. Then, copy the contents of the package.json file to the package.json file in the basic structure of the project, and copy the modules directory to the src directory of the basic structure of the project.

2. The method for quickly constructing a front-end scaffolding based on modular design according to claim 1 is characterized in that: Generate a front-end project based on the processing results, including: Import all modules into the created project basic structure and register them globally.

3. The method for quickly constructing a front-end scaffolding based on modular design according to claim 2 is characterized in that: In the created project basic structure, introduce all modules and register them globally, including: Open the project entry file in the project basic structure, import all modules in the project entry file and register them globally.

4. The method for quickly constructing a front-end scaffold based on modular design according to claim 1 is characterized in that: Add the required tool configurations as you create the basic structure of your project.

5. A front-end scaffolding rapid construction system based on modular design, characterized in that: include: A module storage device, which is used to store a plurality of predefined modules in a module library, wherein each module includes a specific source code file and a configuration file; A module selector, which is used to select a desired module from the module library; A module assembler, which is used to handle the integration and dependencies between selected modules; A project generator, which is used to generate a front-end project according to the processing results, wherein the front-end project includes the source code file and configuration file of the selected module, the basic structure of the project and the required tool configuration; Handle integration and dependencies between selected modules, including: Get the dependency library configuration file of the selected module; Read the dependency library configuration files of all modules to get the dependencies of each module; Summarize all dependencies and deduplicate them based on the dependency names; Generate a front-end project based on the processing results, including: Temporarily create a directory, and create a project configuration file and module directory under the directory; Copy the module's dependencies after dependency deduplication processing to the project configuration file, and copy the module's source code file to the module directory; Create the basic structure of the project, and copy the contents of the project configuration file and the module directory to the basic structure of the project. Use node to temporarily create a directory temp, and create a file package.json and a directory modules in the directory. The package.json file can record the relevant information and dependencies of the processed module, and the modules directory stores the specific source code files of the module. Use nodejs to operate files, copy the dependencies of the module that has been deduplicated to the package.json file and save it, and use nodejs to operate files, copy the source code files of all modules to the modules directory and save them; Use the vue-cl i tool to create the basic structure of the project. In this process, choose to add tools. Then, in the basic structure of the project, open the project entry file main.js by operating the file in nodejs, introduce all modules and register them globally. Then, copy the contents of the package.json file to the package.json file in the basic structure of the project, and copy the modules directory to the src directory of the basic structure of the project.

6. The front-end scaffolding rapid construction system based on modular design according to claim 5 is characterized in that: The module selector has a visual interface, and all modules predefined in the module library are displayed on the visual interface.

7. An electronic device, characterized in that: It includes a memory, a processor, and a computer program stored in the memory and executable on the processor. When the processor executes the program, it implements the method for quickly constructing a front-end scaffolding based on modular design as described in any one of claims 1 to 4.

8. A non-transitory computer-readable storage medium, characterized in that: The non-transitory computer-readable storage medium stores computer instructions, and the computer instructions are used to enable a computer to execute the front-end scaffolding rapid construction method based on modular design as described in any one of claims 1 to 4.

Citation Information

Patent Citations

  • Micro-front-end page application method, device and equipment and readable storage medium

    CN116755822A

  • Method for building front-end scaffold

    CN117055858A