A dynamic web application generation method and system based on a multi-level declarative DSL

Abstract

The application relates to a dynamic Web application generation method and system based on a multi-level declarative DSL, and belongs to the technical field of Web applications. The method receives user input request data to determine a target configuration model, analyzes and generates a tree-shaped configuration structure through a multi-level tree-shaped configuration analysis module; a declarative syntax module analyzes the structure to generate multi-level declarative DSL data and construct a target structured blueprint; a routing metadata conversion algorithm module converts the tree-shaped structure into flattened routing metadata and associates the routing metadata with the DSL; a component rendering module analyzes the DSL to generate Web page rendering data and parameter interface data; a global configuration module analyzes the DSL to determine a page structure relationship and complete initialization settings, and generates a target Web application. The application realizes dynamic generation of a Web application through multi-level declarative DSL, reduces development complexity, and improves development efficiency and flexibility.

Description

Technical Field

[0001] This invention relates to the field of web application generation technology, and in particular to a method and system for generating dynamic web applications based on a multi-level declarative DSL. Background Technology

[0002] In modern web application development, especially in enterprise-level applications such as middle and back-end management systems, traditional manual coding methods suffer from low development efficiency and high maintenance costs. However, the existing generated code is either invisible or heavily compressed and obfuscated, preventing developers from performing in-depth debugging, customization, and extension, resulting in "black box" development. This limits its practicality in complex business scenarios, forcing web application developers to run and adjust the application multiple times after it is generated to meet the application's needs, thus reducing the efficiency of web application generation. Therefore, improvements are needed. Summary of the Invention

[0003] To improve the efficiency of web application generation, this application provides a method and system for generating dynamic web applications based on a multi-level declarative DSL.

[0004] Firstly, the above-mentioned inventive objective of this application is achieved through the following technical solution:

[0005] A method for generating dynamic web applications based on a multi-level declarative DSL, the method comprising the following steps:

[0006] Receive user input request data and analyze the user input request data to determine the corresponding target configuration model;

[0007] A pre-configured multi-level tree configuration analysis module parses the target configuration model to generate the target tree configuration structure corresponding to the target configuration model;

[0008] A pre-configured declarative syntax module analyzes the target tree configuration structure to generate corresponding multi-level declarative DSL data, and performs feature association on the multi-level declarative DSL data to construct a target structured blueprint.

[0009] The pre-configured routing metadata transformation algorithm module analyzes the target tree configuration structure to convert it into flattened routing metadata, and associates the routing metadata with a pre-configured declarative domain-specific language to determine the web page structure relationship;

[0010] The pre-configured component rendering module analyzes the declarative domain-specific language to generate web page rendering data and corresponding parameter interface data for each configuration structure;

[0011] The pre-configured global configuration module parses the declarative domain-specific language to further determine the structural relationships of the web page, and then completes the initialization settings of the web page in sequence to generate the target web application.

[0012] By adopting the above technical solution, the system can drive Web projects through DSL source code that conforms to industry standards and has high readability, rather than black-box runtime packages or compressed code. Developers can transparently view, debug, and extend the project source code, realizing a combination of configuration-driven and manual development. While improving development efficiency, it ensures the long-term controllability and evolution capability of the project. The application structure generated by this method can fully call on the advanced features of the underlying framework, thereby achieving the same functionality and performance as manually written code, thus improving the generation efficiency of Web applications.

[0013] In a preferred embodiment, this application can be further configured to: receive user input request data and analyze the user input request data to determine the corresponding target configuration model; this step includes the following steps:

[0014] The command-line interaction submodule receives user input and dynamically determines the user's expected target configuration model.

[0015] Once the user confirms the selection, the selected target configuration model is automatically imported into the project entry file, and the corresponding environment variable configuration file is generated simultaneously, so that the required global configuration information can be obtained during the initialization phase.

[0016] In a preferred example, this application can be further configured as follows: in the step of parsing the target configuration model in a pre-set multi-level tree configuration analysis module to generate a target tree configuration structure corresponding to the target configuration model, the target tree configuration structure is used to determine the number of configuration structure levels and the relationship between them in the target configuration model;

[0017] The multi-level tree configuration analysis module includes at least three levels: project level, directory level, and menu level.

[0018] The project-level structure hierarchy is used to configure the overall attributes and infrastructure definitions of the application.

[0019] The directory-level structure hierarchy is used to configure corresponding logical function groups;

[0020] The menu-level structure hierarchy is used to configure and describe specific page units.

[0021] In a preferred example, this application can be further configured as follows: the step of analyzing the target tree configuration structure in a pre-set declarative syntax module to generate corresponding multi-level declarative DSL data, and performing feature association on the multi-level declarative DSL data to construct a target structured blueprint, includes the following steps:

[0022] A pre-configured declarative syntax generation submodule analyzes the target tree configuration structure to generate a declarative domain-specific language corresponding to each configuration structure level.

[0023] The pre-defined declarative syntax definition submodule analyzes the attributes and relationships of each configuration structure level to perform hierarchical feature association with the declarative domain-specific language, thereby constructing the target structured blueprint corresponding to the target configuration model through the declarative domain-specific language.

[0024] In a preferred example, this application can be further configured such that the step of analyzing the target tree configuration structure in a pre-set routing metadata transformation algorithm module to convert it into flattened routing metadata, and associating the routing metadata with a pre-set declarative domain-specific language, includes the following steps:

[0025] The routing metadata classification submodule analyzes the target tree configuration structure and determines the quantity and category of routing metadata based on the type and nesting relationship of the nodes in order to construct a routing metadata classification dataset, which includes a first category of metadata and a second category of metadata.

[0026] The first metadata transformation submodule analyzes the first type of metadata to generate a hierarchical display structure for maintaining the menu components;

[0027] The second metadata transformation submodule analyzes the second type of metadata to generate a one-dimensional routing table for route navigation;

[0028] The access path adjustment submodule adjusts the route access path based on pre-set hierarchical rules and injects page configuration information into the corresponding route component properties to achieve dynamic binding between configuration information and view.

[0029] In a preferred example, this application can be further configured such that the step of analyzing the declarative domain-specific language in a pre-set component rendering module to generate Web page rendering data and corresponding parameter interface data for each configuration structure includes the following steps:

[0030] The rendering requirements analysis submodule analyzes the declarative domain-specific language based on pre-set parsing rules to generate rendering requirements data corresponding to each configuration structure;

[0031] The rendering execution submodule analyzes the rendering requirement data based on preset matching rules and performs page rendering for each configuration structure;

[0032] The rendering coordination submodule generates global rendering coordination data corresponding to the Web application based on the target structured blueprint. The global rendering coordination data is used to plan the relationship between each page of the target configuration model.

[0033] The interactive execution submodule analyzes the global rendering coordination data based on the pre-set interactive logic and generates corresponding parameter interface data for each configuration structure.

[0034] In a preferred embodiment, this application can be further configured as follows: The step of parsing the declarative domain-specific language in a pre-set global configuration module to further determine the web page structure relationships and sequentially completing the web page initialization settings to generate the target web application includes the following steps:

[0035] The pre-configured global planning submodule parses the declarative domain-specific language based on pre-configured parsing rules to generate global configuration data for the web application;

[0036] The routing instance execution submodule completes the routing instantiation demonstration data based on the global configuration data and records the demonstration data;

[0037] The state management submodule compares the demonstration data with the expected running data and determines whether there are any running anomalies in order to achieve state management initialization;

[0038] The basic component injection submodule injects infrastructure into the web application based on pre-set component matching rules to generate the target web application.

[0039] Secondly, the above-mentioned inventive objective of this application is achieved through the following technical solutions:

[0040] A dynamic web application generation device based on a multi-level declarative DSL, the device comprising: a target configuration model generation unit, wherein the application receives user input request data and analyzes the user input request data to determine the corresponding target configuration model;

[0041] The target tree configuration structure generation unit is configured to pre-set a multi-level tree configuration analysis module to parse the target configuration model in order to generate the target tree configuration structure corresponding to the target configuration model;

[0042] The target structured blueprint construction unit is equipped with a pre-set declarative syntax module to analyze the target tree configuration structure to generate corresponding multi-level declarative DSL data, and to perform feature association on the multi-level declarative DSL data to construct the target structured blueprint.

[0043] A flattened routing metadata generation unit is used to analyze the target tree configuration structure using a pre-set routing metadata conversion algorithm module, convert it into flattened routing metadata, and associate the routing metadata with a pre-set declarative domain-specific language to determine the web page structure relationship.

[0044] The page rendering data unit is used to pre-configure a component rendering module to analyze the declarative domain-specific language to generate Web page rendering data and corresponding parameter interface data for each configuration structure.

[0045] The target web application generation unit is configured with a pre-set global configuration module to parse the declarative domain-specific language to further determine the web page structure relationship, and sequentially complete the web page initialization settings to generate the target web application.

[0046] Thirdly, the above-mentioned objectives of this application are achieved through the following technical solutions:

[0047] An electronic device includes a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the computer program to implement the steps of the above-described method for generating dynamic web applications based on a multi-level declarative DSL.

[0048] Fourthly, the above-mentioned objectives of this application are achieved through the following technical solutions:

[0049] A computer-readable storage medium storing a computer program that, when executed by a processor, implements the steps of the above-described method for generating dynamic web applications based on a multi-level declarative DSL. Attached Figure Description

[0050] Figure 1 This is a flowchart of a dynamic web application generation method based on a multi-level declarative DSL according to the present invention;

[0051] Figure 2 This is a flowchart of the steps of a dynamic web application generation method based on a multi-level declarative DSL in one embodiment of the present invention;

[0052] Figure 3 This is a schematic diagram of an electronic device according to an embodiment of this application. Detailed Implementation

[0053] The present application will be further described in detail below with reference to the accompanying drawings.

[0054] In one embodiment, such as Figure 1 As shown, this application discloses a method for generating dynamic web applications based on a multi-level declarative DSL, which specifically includes the following steps:

[0055] S10: Receive user input request data and analyze the user input request data to determine the corresponding target configuration model;

[0056] S20: The pre-set multi-level tree configuration analysis module parses the target configuration model to generate the target tree configuration structure corresponding to the target configuration model;

[0057] S30: The pre-configured declarative syntax module analyzes the target tree configuration structure to generate corresponding multi-level declarative DSL data, and performs feature association on the multi-level declarative DSL data to construct the target structured blueprint;

[0058] DSL stands for Domain Specific Language, a language that meets the specific needs of various domains.

[0059] S40: The pre-configured routing metadata conversion algorithm module analyzes the target tree configuration structure to convert it into flattened routing metadata, and associates the routing metadata with a pre-configured declarative domain-specific language to determine the web page structure relationship;

[0060] Specifically, in this embodiment, the routing metadata conversion algorithm module uses a path recursion algorithm to convert the tree structure into flat routing metadata and dynamically bind it to the DSL.

[0061] S50: The pre-configured component rendering module analyzes the declarative domain-specific language to generate Web page rendering data and corresponding parameter interface data for each configuration structure;

[0062] S60: The pre-configured global configuration module parses the declarative domain-specific language to further determine the structural relationships of the web page, and sequentially completes the initialization settings of the web page to generate the target web application.

[0063] Furthermore, regarding steps S10-S60, this method receives user requests and determines the target configuration model; a multi-level tree configuration analysis module, comprising project-level, directory-level, and menu-level three-layer structures, parses and generates a tree configuration structure; a declarative syntax module converts the tree structure into multi-level declarative DSL data and constructs the target structured blueprint; a route metadata conversion module, based on a path recursion algorithm, converts the tree structure into flattened route metadata and dynamically binds it to the DSL; a component rendering module analyzes the DSL to generate web page rendering data and parameter interface data; and a global configuration module parses the DSL to complete route instantiation, state management initialization, and infrastructure injection, generating a readable source code target web application conforming to industry standards. This invention achieves a seamless integration of configuration-driven development and manual coding, ensuring that the generated code has complete debugging capabilities and native framework performance.

[0064] Regarding steps S10-S60, the embodiments of this application combine... Figure 2 Explain the overall workflow:

[0065] Developers create a new terminal and enter the startup command `npm run dev`. This command will first execute step 1: run a custom Node.js script to take over the terminal (e.g., ` / script / switchDSL.js`).

[0066] Then proceed to step 2: The script will present all available DSL configuration names in an interactive list in the terminal interface. After the developer selects the target DSL using the up and down arrow keys and confirms, the script will perform two core operations: write the import and export statements of the corresponding DSL module into the specified project entry file (such as / src / init / entry.js).

[0067] Secondly, read the dedicated configuration file in the DSL directory and inject the relevant environment variables into the .env.development or .env.production file in the project root directory.

[0068] After the configuration injection is completed, the process proceeds to step 3: the system officially starts the build tool (Vite in this embodiment).

[0069] During the initialization process, the build tool will execute step 4, which is to call the application startup function (defined in / src / init / index.js).

[0070] The startup function then executes step 5, guiding the route resolver to load and recursively traverse the selected DSL configuration tree. Based on the hierarchical structure of the DSL, the resolver automatically generates the corresponding routing table and instantiates it in step 6, constructing a complete project navigation structure. At this point, the application enters a ready state, awaiting user access.

[0071] When a user accesses the project URL through a browser in step 7, the routing system will match the corresponding path. Finally, in step 8, the routing component drives the rendering of the target template page. The template receives the attribute parameters (props) generated by the DSL parsing, and ultimately presents the complete business page.

[0072] In S10: Receive user input request data and analyze the user input request data to determine the corresponding target configuration model; this step includes the following steps:

[0073] S101: Receives user input through the command-line interaction submodule and dynamically determines the user's expected target configuration model;

[0074] S102: Once the user confirms the selection, the selected target configuration model is automatically imported into the project entry file, and the corresponding environment variable configuration file is generated simultaneously, so that the required global configuration information can be obtained during the initialization phase.

[0075] This invention introduces a well-structured and flexibly combinable multi-level declarative DSL configuration model and constructs a white-box, modular web application generation system, achieving the following beneficial effects:

[0076] 1. The generated code is fully readable and customizable:

[0077] The system is based on highly readable source code that conforms to industry standards, rather than black-box runtime packages or compressed code. Developers can transparently view, debug, and extend the generated code, achieving a seamless combination of automated generation and manual development. This improves development efficiency while ensuring the long-term controllability and evolution capability of the project. In this embodiment, the source code is parsable DSL data code to adapt to platforms that can parse DSLs.

[0078] 2. Deep integration with native capabilities of front-end frameworks:

[0079] This system is not framework-agnostic; rather, it deeply integrates the core elements of modern front-end development (such as routing, state management, and component lifecycle). The resulting application structure can fully utilize the advanced features of the underlying framework, thereby achieving functionality and performance comparable to manually writing code.

[0080] 3. Highly modular and composable architecture:

[0081] The system consists of multiple well-defined and decoupled modules (such as configuration management, route generation, template components, and initialization processes), allowing developers to select all or some modules based on their specific needs. This pluggable design enables it to be integrated into existing projects or used as a foundational generator for entirely new applications, providing exceptional flexibility and technological inclusivity.

[0082] Specifically, for steps S101-S102, the overall solution is completed collaboratively by multiple functional layers. Each layer has a clear technical relationship and data flow, and together they achieve the core goal of driving the generation of web applications through declarative configuration.

[0083] In step S20: the pre-set multi-level tree configuration analysis module parses the target configuration model to generate the target tree configuration structure corresponding to the target configuration model. In this step, the target tree configuration structure is used to determine the number of configuration structure levels and their relationships within the target configuration model.

[0084] The multi-level tree configuration analysis module includes at least three levels: project level, directory level, and menu level.

[0085] Furthermore, the project-level structure hierarchy is used to configure the overall attributes and infrastructure definitions of the application;

[0086] The directory-level structure hierarchy is used to configure corresponding logical function groups;

[0087] The menu-level structure hierarchy is used to configure and describe specific page units.

[0088] It should be noted that in other embodiments, the multi-level tree configuration analysis module can set different numbers of levels and corresponding hierarchical relationships according to specific hierarchical allocation rules. For example, it can be expanded to more granular configuration levels such as submenu level or component level according to actual business needs to support the declarative definition of complex application structures. Each level is associated with a unique identifier to ensure the consistency and traceability of configuration information during the parsing process.

[0089] In step S30: the pre-configured declarative syntax module analyzes the target tree configuration structure to generate corresponding multi-level declarative DSL data, and performs feature association on the multi-level declarative DSL data to construct the target structured blueprint, the following steps are included:

[0090] S301: The pre-configured declarative syntax generation submodule analyzes the target tree configuration structure to generate a declarative domain-specific language corresponding to each configuration structure level;

[0091] S302: The pre-defined declarative syntax definition submodule analyzes the attributes and relationships of each configuration structure level to perform hierarchical feature association of the declarative domain-specific language, thereby constructing the target structured blueprint corresponding to the target configuration model through the declarative domain-specific language.

[0092] In step S40: the pre-configured routing metadata transformation algorithm module analyzes the target tree configuration structure to convert it into flattened routing metadata, and associates the routing metadata with a pre-configured declarative domain-specific language. This step includes the following steps:

[0093] S401: The routing metadata classification submodule analyzes the target tree configuration structure and determines the quantity and category of routing metadata based on the type and nesting relationship of the nodes in order to construct a routing metadata classification dataset, wherein the routing metadata classification dataset includes a first type of metadata and a second type of metadata;

[0094] S402: The first metadata conversion submodule analyzes the first type of metadata to generate a hierarchical display structure for maintaining the menu components;

[0095] S403: The second metadata transformation submodule analyzes the second type of metadata to generate a one-dimensional routing table for route navigation;

[0096] S404: The access path adjustment submodule adjusts the route access path based on the preset hierarchical rules, injects the page configuration information into the corresponding route component properties, and realizes the dynamic binding of configuration information and view.

[0097] Specifically, this parsing process, based on the type and nesting relationship of nodes, splits the route object into at least two types of metadata: the first type is used to maintain the hierarchical display structure of menu components; the second type is used to generate a one-dimensional route table that can be directly used for route navigation. During the conversion process, the system automatically constructs a route access path that conforms to the specifications and injects the page configuration information into the corresponding route component properties, realizing the dynamic binding of configuration information and view.

[0098] In step S50: the pre-configured component rendering module analyzes the declarative domain-specific language to generate web page rendering data and corresponding parameter interface data for each configuration structure, the steps include the following:

[0099] S501: The rendering requirement analysis submodule analyzes the declarative domain-specific language based on pre-set parsing rules to generate rendering requirement data corresponding to each configuration structure;

[0100] S502: The rendering execution submodule analyzes the rendering requirement data based on preset matching rules and renders the page for each configuration structure;

[0101] S503: The rendering coordination submodule generates global rendering coordination data corresponding to the Web application based on the target structured blueprint. The global rendering coordination data is used to plan the relationship between each page of the target configuration model.

[0102] S504: The interactive execution submodule analyzes the global rendering coordination data based on the pre-set interactive logic and generates corresponding parameter interface data for each configuration structure.

[0103] In this embodiment of the application, for steps S501-S504, the system provides a series of predefined page templates. Each template encapsulates common interaction logic and abstracts the variable parts of the business into configurable parameter interfaces. By implementing configuration parsing and attribute injection mechanisms inside the template, the system can directly configure and drive page rendering according to the declarative DSL, and can flexibly adapt to diverse business scenarios without modifying the template source code.

[0104] The above mechanism is the main difference between this solution and conventional low-code platforms: it decouples business logic from the technical framework through DSL configuration injection, significantly improving development efficiency; and it fully utilizes the complete code capabilities of the underlying reactive framework to support complex interactions and high customization, avoiding the limitations of invisible and unadjustable code generated in traditional solutions.

[0105] In step S60: The pre-configured global configuration module parses the declarative domain-specific language to further determine the web page structure relationships and sequentially completes the web page initialization settings to generate the target web application. This step includes the following steps:

[0106] S601: The pre-configured global planning submodule parses the declarative domain-specific language based on pre-configured parsing rules to generate global configuration data for the Web application;

[0107] S602: The routing instance execution submodule completes the routing instantiation demonstration data based on the global configuration data and records the demonstration data;

[0108] S603: The state management submodule compares the demonstration data with the expected running data and determines whether there is any running abnormality, so as to realize the state management initialization;

[0109] S604: The Basic Component Injection Submodule injects infrastructure into the Web application based on pre-set component matching rules to generate the target Web application.

[0110] For steps S601-S604:

[0111] This application uses the generation of a simple "power plant information management system" as an example to explain in detail the specific implementation process of the present invention.

[0112] A new project is created using the Vue 3 framework and the Vite build tool, and Vue Router and Pinia libraries are installed. The application initialization logic (creating application instances, initializing routes, state management, UI component libraries, theme configuration, etc.) is encapsulated in a startup function named `bootstrap`. This function receives a key parameter: a project-level DSL configuration object. After receiving this parameter, the `routes` property, representing the project-level DSL, and other properties, `config`, are parsed out. The `routes` property is used to initialize routes and automatically create the project's directory structure. The `config` property is passed as the second parameter to `createApp` to perform dependency injection in the root component, facilitating the construction of component and template libraries. This function is called in the project's main entry file (`src / init / index.js` in this embodiment), passing in the entire project's DSL.

[0113] The core of this invention lies in using a multi-level JavaScript-DSL configuration structure to define the overall architecture and functionality of a web application. An example of the project-level DSL configuration for the "Power Plant Information Management System" is provided below. Figure 2 As shown, it serves as the root node of the entire configuration system, defining the application's global attributes, including the project name, root path, child DSL set, login page configuration (such as the login template used, interface address, and text information), and main interface configuration (such as the main interface template, hook functions, etc.).

[0114] The `routes` field in the project-level DSL further references the directory-level DSL configuration. The directory-level DSL describes the system's navigation module structure and typically includes a directory name, an icon, and its sub-DSL collections. Notably, this level supports configuring independent page branches: these pages are not embedded in the main template's tree-like routing structure but are rendered as independent route pages, commonly seen in scenarios such as large-screen monitoring embedded in third-party systems or iframe pages.

[0115] Under the `children` field of the directory-level DSL, a menu-level DSL can be configured to describe specific functional pages. A typical menu-level DSL includes elements such as menu name, template used, data interface (dao), table item configuration (items), and operation buttons (btns). It should be noted that the specific structure of the DSL in this embodiment can be flexibly expanded according to the template function, and its design principles are as described above.

[0116] Menu-level DSLs can be further nested with `children` fields to define submenu pages. Submenus and their parent menu pages belong to the same functional module and are typically displayed mutually exclusively in tab navigation. There is a clear routing relationship between them: the submenu page provides a back button to return to the parent menu page, and the parent menu page must also provide a corresponding button to navigate to the submenu page.

[0117] In summary, this application, through a multi-level DSL structure and hierarchical configuration at the project, directory, and menu levels, constitutes a complete configuration system for declarative web application generation.

[0118] Furthermore, it is necessary to implement the selection of the DSL module, as follows:

[0119] Before starting the development server (npm run dev) or the build command (npm run build), a custom Node.js script (DSL selection layer) will be executed first. In a preferred implementation, this script uses the inquirer.js library to provide an interactive command-line interface (CLI), scans the directory where the unified DSL is stored (src / project), and lists all available DSL configurations (such as station-manage, scada-monitor).

[0120] Preferably, after the developer selects using the up and down arrow keys, the script uses the fs.writeFileSync module to write statements for reading the DSL (e.g., `import config from '.. / project / ${model} / index.js';\nexport defaultconfig;\n`) to generate the DSL entry file (e.g., src / init / entry.js). The bootstrap function will then read the project-level DSL from this path.

[0121] Meanwhile, the system locates config.js in the selected DSL root directory, generates environment variables and comments using a pre-defined map, and writes them to the .env file using the fs.writeFileSync API. This step ensures that the correct configuration has been dynamically loaded when the build process begins.

[0122] During application initialization, the bootstrap function receives the configuration from the entry.js file and calls the route resolver for processing. The route resolver recursively traverses the tree structure of the DSL (children field) and performs the following key operations:

[0123] 1. Path Concatenation: Automatically generate standardized route paths based on node type and nesting relationship. For example, the final path of the "User List" menu above is standardized to: / home / system / user, and the path of the user details menu is standardized to: / home / system / user-info (where submenu names are connected by hyphens).

[0124] 2. Metadata Extraction and Injection: As a preferred solution, the framework has built-in system templates stored in a map. When a user passes a string to the `tmp` field, the built-in templates are matched against the map. If the built-in templates do not meet the requirements and custom development is needed, a Vue page can also be passed in and the entire page can be mounted.

[0125] Preferably, the h function is used to render the template in the component field of vue-router, and the remaining DSL properties are wrapped in config and passed as page props.

[0126] Furthermore, for directory-level DSLs, the page template with router-view is used as an intermediary for parsing sub-route components when matching templates. For menu-level DSLs, the data types are handled as described above; if it's a string, it matches the template library, and otherwise, it's rendered as a whole Vue page, leveraging the full capabilities of code development.

[0127] 3. Structure Transformation: The nested tree structure is transformed into a flat routing table with a two-layer structure: one layer is a tree hierarchy for building the navigation menu, and the other layer is for URLs that need to be processed separately (such as iframes that hold external addresses). Therefore, a one-dimensional route array is extracted outside the tree menu. This design standardizes the routing rules, improves route matching and page caching efficiency, and also increases the number of adaptable scenarios.

[0128] Furthermore, after obtaining the route metadata after recursive parsing, the route initialization data can be assembled, selecting the templates for the login page, 404 error page, and main interface. If no custom template is passed to the initialization function `bootstrap`, the default template will be used. This ensures configurability for all common pages. Finally, `createRouter` is called to generate the system routes.

[0129] After the application starts, when a user accesses / home / system / user, Vue Router will match the corresponding route record and render the list component. This template component, within the setup syntactic sugar, will retrieve all configuration items injected in step S103 via props.config.

[0130] Preferably, when implementing a built-in template library, certain design principles should be followed, namely, dividing the template design into two parts:

[0131] 1. General Interaction Layer: The logic of internal component interactions (such as selecting list data, disabling the edit button), pagination, loading, data retrieval methods, error handling, etc., has been pre-encapsulated within the template.

[0132] 2. Variable Business Layer: The template dynamically renders the interface based on the passed-in configuration. For example, it dynamically generates form items for the search bar using the `searchs` object, dynamically renders table columns using the `items` object, and initiates data requests based on the DAO.

[0133] Ultimately, users see a fully functional user list page, all generated entirely by DSL configuration without requiring any page component code.

[0134] Example 2: Dynamic switching of multiple application configurations

[0135] To demonstrate the modularity and flexibility of this invention, a second embodiment is provided. It is assumed that the same codebase needs to support two completely different applications: a "power plant information management system" and a "data monitoring dashboard".

[0136] Simply create two independent DSL configurations (such as station-manage and scada-monitor) in the src / project / directory. Each configuration has completely independent project-level, directory-level, and menu-level configurations.

[0137] Before startup, users can select the project to launch via the CLI interface of the DSL selection layer. After selection, the system injects the corresponding configuration and generates a web application that is completely different in terms of functionality, interface, and routing structure. This demonstrates the pluggability and powerful flexibility of the present invention.

[0138] In summary, this embodiment details how the present invention, starting from a specific DSL configuration, generates a runnable, high-quality web application through an automated parsing and injection process.

[0139] It should be understood that the sequence number of each step in the above embodiments does not imply the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of this application.

[0140] In one embodiment, a dynamic web application generation apparatus based on a multi-level declarative DSL is provided, which corresponds one-to-one with the dynamic web application generation method based on a multi-level declarative DSL described in the above embodiments. For example... Figure 2 As shown, the dynamic web application generation device based on multi-level declarative DSL includes: a target configuration model generation unit, which receives user input request data and analyzes the user input request data to determine the corresponding target configuration model;

[0141] The target tree configuration structure generation unit is configured to pre-set a multi-level tree configuration analysis module to parse the target configuration model in order to generate the target tree configuration structure corresponding to the target configuration model;

[0142] The target structured blueprint construction unit is equipped with a pre-set declarative syntax module to analyze the target tree configuration structure to generate corresponding multi-level declarative DSL data, and to perform feature association on the multi-level declarative DSL data to construct the target structured blueprint.

[0143] A flattened routing metadata generation unit is used to analyze the target tree configuration structure using a pre-set routing metadata conversion algorithm module, convert it into flattened routing metadata, and associate the routing metadata with a pre-set declarative domain-specific language to determine the web page structure relationship.

[0144] The page rendering data unit is used to pre-configure a component rendering module to analyze the declarative domain-specific language to generate Web page rendering data and corresponding parameter interface data for each configuration structure.

[0145] The target web application generation unit is configured with a pre-set global configuration module to parse the declarative domain-specific language to further determine the web page structure relationship, and sequentially complete the web page initialization settings to generate the target web application.

[0146] Specific limitations regarding the dynamic web application generation device based on multi-level declarative DSL can be found in the limitations of the dynamic web application generation method based on multi-level declarative DSL mentioned above, and will not be repeated here. Each module in the aforementioned dynamic web application generation device based on multi-level declarative DSL can be implemented entirely or partially through software, hardware, or a combination thereof. These modules can be embedded in or independent of the processor in the electronic device, or stored in the memory of the electronic device in software form, so that the processor can call and execute the operations corresponding to each module.

[0147] In one embodiment, an electronic device is provided, which may be a server, and its internal structure diagram may be as follows: Figure 3 As shown, this electronic device includes a processor, memory, network interface, and database connected via a system bus. The processor provides computing and control capabilities. The memory includes a non-volatile storage medium and internal memory. The non-volatile storage medium stores the operating system, computer programs, and database. The internal memory provides an environment for the operation of the operating system and computer programs stored in the non-volatile storage medium. The database stores the database. The network interface is used to communicate with external terminals via a network connection. When the computer program is executed by the processor, it implements a dynamic web application generation method based on a multi-level declarative DSL.

[0148] In one embodiment, an electronic device is provided, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the computer program to perform the following steps:

[0149] Receive user input request data and analyze the user input request data to determine the corresponding target configuration model;

[0150] A pre-configured multi-level tree configuration analysis module parses the target configuration model to generate the target tree configuration structure corresponding to the target configuration model;

[0151] A pre-configured declarative syntax module analyzes the target tree configuration structure to generate corresponding multi-level declarative DSL data, and performs feature association on the multi-level declarative DSL data to construct a target structured blueprint.

[0152] The pre-configured routing metadata transformation algorithm module analyzes the target tree configuration structure to convert it into flattened routing metadata, and associates the routing metadata with a pre-configured declarative domain-specific language to determine the web page structure relationship;

[0153] The pre-configured component rendering module analyzes the declarative domain-specific language to generate web page rendering data and corresponding parameter interface data for each configuration structure;

[0154] The pre-configured global configuration module parses the declarative domain-specific language to further determine the structural relationships of the web page, and then completes the initialization settings of the web page in sequence to generate the target web application.

[0155] In one embodiment, a computer-readable storage medium is provided having a computer program stored thereon, the computer program performing the following steps when executed by a processor:

[0156] Receive user input request data and analyze the user input request data to determine the corresponding target configuration model;

[0157] A pre-configured multi-level tree configuration analysis module parses the target configuration model to generate the target tree configuration structure corresponding to the target configuration model;

[0158] A pre-configured declarative syntax module analyzes the target tree configuration structure to generate corresponding multi-level declarative DSL data, and performs feature association on the multi-level declarative DSL data to construct a target structured blueprint.

[0159] The pre-configured routing metadata transformation algorithm module analyzes the target tree configuration structure to convert it into flattened routing metadata, and associates the routing metadata with a pre-configured declarative domain-specific language to determine the web page structure relationship;

[0160] The pre-configured component rendering module analyzes the declarative domain-specific language to generate web page rendering data and corresponding parameter interface data for each configuration structure;

[0161] The pre-configured global configuration module parses the declarative domain-specific language to further determine the structural relationships of the web page, and then completes the initialization settings of the web page in sequence to generate the target web application.

[0162] Those skilled in the art will understand that all or part of the processes in the methods of the above embodiments can be implemented by a computer program instructing related hardware. The computer program can be stored in a non-volatile computer-readable storage medium. When executed, the computer program can include the processes of the embodiments of the above methods. Any references to memory, storage, databases, or other media used in the embodiments provided in this application can include non-volatile and / or volatile memory. Non-volatile memory may include read-only memory (ROM), programmable ROM (PROM), electrically programmable ROM (EPROM), electrically erasable programmable ROM (EEPROM), or flash memory. Volatile memory may include random access memory (RAM) or external cache memory. By way of illustration and not limitation, RAM is available in a variety of forms, such as static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), dual data rate SDRAM (DDRSDRAM), enhanced SDRAM (ESDRAM), synchronous link DRAM (SLDRAM), RAMbus direct RAM (RDRAM), direct memory bus dynamic RAM (DRDRAM), and memory bus dynamic RAM (RDRAM), etc.

[0163] Those skilled in the art will clearly understand that, for the sake of convenience and brevity, the above-described division of functional units and modules is used as an example. In practical applications, the above functions can be assigned to different functional units and modules as needed, that is, the internal structure of the device can be divided into different functional units or modules to complete all or part of the functions described above.

[0164] The above-described embodiments are only used to illustrate the technical solutions of this application, and are not intended to limit them. Although this application has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some of the technical features. Such modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the spirit and scope of the technical solutions of the embodiments of this application, and should all be included within the protection scope of this application.

Claims

1. A method for generating dynamic web applications based on a multi-level declarative DSL, characterized in that, The method includes the steps of: receiving user input request data and analyzing the user input request data to determine the corresponding target configuration model; A pre-set multi-level tree configuration analysis module parses the target configuration model to generate a target tree configuration structure corresponding to the target configuration model, wherein the target tree configuration structure is used to determine the number of configuration structure levels and the relationships between them in the target configuration model; The multi-level tree configuration analysis module includes at least three levels: project level, directory level, and menu level. The project-level structure hierarchy is used to configure the overall attributes and infrastructure definitions of the application. The directory-level structure hierarchy is used to configure corresponding logical function groups; The menu-level structure hierarchy is used to configure and describe specific page units; A pre-configured declarative syntax module analyzes the target tree configuration structure to generate corresponding multi-level declarative DSL data, and performs feature association on the multi-level declarative DSL data to construct a target structured blueprint. Specifically, a pre-defined declarative syntax generation submodule analyzes the target tree configuration structure to generate a declarative domain-specific language corresponding to each configuration structure level. The pre-defined declarative syntax definition submodule analyzes the attributes and relationships of each configuration structure level to perform hierarchical feature association with the declarative domain-specific language, thereby constructing the target structured blueprint corresponding to the target configuration model through the declarative domain-specific language; The pre-configured routing metadata transformation algorithm module analyzes the target tree configuration structure to convert it into flattened routing metadata, and associates the routing metadata with a pre-configured declarative domain-specific language to determine the web page structure relationship; Furthermore, the step of analyzing the target tree configuration structure in the pre-set routing metadata transformation algorithm module to convert it into flattened routing metadata, and associating the routing metadata with a pre-set declarative domain-specific language, specifically includes: The routing metadata classification submodule analyzes the target tree configuration structure and determines the quantity and category of routing metadata based on the type and nesting relationship of the nodes in order to construct a routing metadata classification dataset, which includes a first category of metadata and a second category of metadata. The first metadata transformation submodule analyzes the first type of metadata to generate a hierarchical display structure for maintaining the menu components; The second metadata transformation submodule analyzes the second type of metadata to generate a one-dimensional routing table for route navigation; The access path adjustment submodule adjusts the route access path based on the preset hierarchical rules and injects the page configuration information into the corresponding route component properties to achieve dynamic binding between the configuration information and the view. The pre-configured component rendering module analyzes the declarative domain-specific language to generate web page rendering data and corresponding parameter interface data for each configuration structure; The pre-configured global configuration module parses the declarative domain-specific language to further determine the structural relationships of the web page, and then completes the initialization settings of the web page in sequence to generate the target web application.

2. The method for generating dynamic web applications based on a multi-level declarative DSL according to claim 1, characterized in that, The step of receiving user input request data and analyzing the user input request data to determine the corresponding target configuration model includes the following steps: The command-line interaction submodule receives user input and dynamically determines the user's expected target configuration model. Once the user confirms the selection, the selected target configuration model is automatically imported into the project entry file, and the corresponding environment variable configuration file is generated simultaneously, so that the required global configuration information can be obtained during the initialization phase.

3. The method for generating dynamic web applications based on a multi-level declarative DSL according to claim 2, characterized in that, The step of analyzing the declarative domain-specific language in the pre-configured component rendering module to generate web page rendering data and corresponding parameter interface data for each configuration structure includes the following steps: The rendering requirements analysis submodule analyzes the declarative domain-specific language based on pre-set parsing rules to generate rendering requirements data corresponding to each configuration structure; The rendering execution submodule analyzes the rendering requirement data based on preset matching rules and performs page rendering for each configuration structure; The rendering coordination submodule generates global rendering coordination data corresponding to the Web application based on the target structured blueprint. The global rendering coordination data is used to plan the relationship between each page of the target configuration model. The interactive execution submodule analyzes the global rendering coordination data based on the pre-set interactive logic and generates corresponding parameter interface data for each configuration structure.

4. The method for generating dynamic web applications based on a multi-level declarative DSL according to claim 3, characterized in that, The step of parsing the declarative domain-specific language in the pre-configured global configuration module to further determine the structural relationships of the web page and sequentially completing the web page initialization settings to generate the target web application includes the following steps: The pre-configured global planning submodule parses the declarative domain-specific language based on pre-configured parsing rules to generate global configuration data for the web application; The routing instance execution submodule completes the routing instantiation demonstration data based on the global configuration data and records the demonstration data; The state management submodule compares the demonstration data with the expected running data and determines whether there are any running anomalies in order to achieve state management initialization; The basic component injection submodule injects infrastructure into the web application based on pre-set component matching rules to generate the target web application.

5. A dynamic web application generation apparatus based on a multi-level declarative DSL, applied to the dynamic web application generation method based on a multi-level declarative DSL as described in any one of claims 1 to 4, characterized in that, The device includes: The target configuration model generation unit receives user input request data and analyzes the user input request data to determine the corresponding target configuration model. A target tree configuration structure generation unit is used to pre-configure a multi-level tree configuration analysis module to parse the target configuration model and generate a target tree configuration structure corresponding to the target configuration model. The target tree configuration structure is used to determine the number of configuration structure levels and relationships of the target configuration model. The multi-level tree configuration analysis module includes at least three levels: project level, directory level, and menu level. The project level structure is used to configure the overall attributes and infrastructure definitions of the application. The directory level structure is used to configure the corresponding logical function groups. The menu level structure is used to configure the description of specific page units. A target structured blueprint construction unit is configured with a pre-set declarative syntax module to analyze the target tree configuration structure to generate corresponding multi-level declarative DSL data, and to perform feature association on the multi-level declarative DSL data to construct a target structured blueprint. The target structured blueprint construction unit includes a declarative syntax generation submodule and a declarative syntax definition submodule. The declarative syntax generation submodule analyzes the target tree configuration structure to generate a declarative domain-specific language corresponding to each configuration structure level. The declarative syntax definition submodule analyzes the attributes and relationships of each configuration structure level to perform hierarchical feature association on the declarative domain-specific language, thereby constructing a target structured blueprint corresponding to the target configuration model using the declarative domain-specific language. A flattened routing metadata generation unit is used to analyze the target tree configuration structure using a pre-set routing metadata conversion algorithm module, converting it into flattened routing metadata, and associating the routing metadata with a pre-set declarative domain-specific language to determine the web page structure relationship. The flattened routing metadata generation unit includes a routing metadata classification submodule, a first metadata conversion submodule, and a second metadata conversion submodule. Specifically, the routing metadata classification submodule analyzes the target tree configuration structure, determines the quantity and category of routing metadata based on the type and nesting relationship of nodes, and constructs a routing metadata classification dataset, which includes a first type of metadata and a second type of metadata. The first metadata conversion submodule analyzes the first type of metadata to generate a hierarchical display structure for maintaining menu components. The second metadata conversion submodule analyzes the second type of metadata to generate a one-dimensional routing table for route navigation. The access path adjustment submodule adjusts the route access path based on pre-set hierarchical rules and injects page configuration information into the corresponding route component attributes to achieve dynamic binding between configuration information and views. The page rendering data unit is used to pre-configure a component rendering module to analyze the declarative domain-specific language to generate Web page rendering data and corresponding parameter interface data for each configuration structure. The target web application generation unit is configured with a pre-set global configuration module to parse the declarative domain-specific language to further determine the web page structure relationship, and sequentially complete the web page initialization settings to generate the target web application.

6. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, characterized in that, When the processor executes the computer program, it implements the steps of a dynamic web application generation method based on a multi-level declarative DSL as described in any one of claims 1 to 4.

7. A computer-readable storage medium storing a computer program, characterized in that, When the computer program is executed by the processor, it implements the steps of a dynamic web application generation method based on a multi-level declarative DSL as described in any one of claims 1 to 4.

Images