Automatic generation method and device of resource import statement, storage medium and electronic equipment
By automating the parsing of the abstract syntax tree and mapping cache table of a Vue project and using the KMP algorithm to match dependency packages, the problem of manually writing resource import statements in Vue projects is solved, achieving efficient and automated dependency management and improving code readability and maintainability.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-12-26
- Publication Date
- 2026-04-21
AI Technical Summary
In Vue projects, resource imports require manually writing import statements, which is tedious and results in low code readability and maintainability, especially in large collaborative projects where maintenance becomes more difficult.
By obtaining the configuration information of the project source code, parsing the abstract syntax tree and generating a mapping cache table, using the KMP algorithm for letter string matching, and automatically generating resource import statements, including parsing dependent and non-dependent packages in the Vue project, and using Webpack or Vite build tools for automated management.
It enables efficient and automated dependency management for Vue projects, reducing manual operations, improving code readability and maintainability, optimizing project build time and resource import accuracy, and enhancing development efficiency and code quality.
Smart Images

Figure CN121900768A_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of software development technology, and more specifically, to a method for automatically generating resource import statements, a device for automatically generating resource import statements, a computer-readable storage medium, and an electronic device. Background Technology
[0002] In modern web development practices, modularization has become a key technology for improving code maintainability, reusability, and project scalability. However, as project size increases and functional requirements grow, manually managing a large number of dependency introductions becomes increasingly cumbersome and inefficient.
[0003] In existing technologies, to import resources in a Vue project, it is necessary to manually write import statements in each non-globally used component and logic file, and the resource used must match the path of the referenced file. Therefore, this manual import method is very cumbersome, and the readability and maintainability of the code are also affected in large collaborative projects, increasing the difficulty of project maintenance. Summary of the Invention
[0004] The main purpose of this application is to provide an automated method for generating resource import statements, an automated device for generating resource import statements, a computer-readable storage medium, and an electronic device, so as to at least solve the problem that in the prior art, resource import in Vue projects requires manual writing of import statements, which is tedious and has low code readability and maintainability.
[0005] To achieve the above objectives, according to one aspect of this application, an automated method for generating resource import statements is provided, comprising: obtaining configuration information of project source code, and parsing the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table; the configuration information includes project resource dependency packages and non-project resource dependency packages, wherein the project resource dependency packages are resource dependency packages included in the project source code, and the non-project resource dependency packages are resource dependency packages not included in the project source code; the target file is a file containing target source code, and the target source code is the source code that needs to import the corresponding target resource dependency package, wherein the target resource dependency package is either the project resource dependency package or the non-project resource dependency package; matching the nodes in the abstract syntax tree with the project resource dependency package and the non-project resource dependency package according to the mapping cache table to determine the target resource dependency package corresponding to the target source code; and generating a corresponding resource import statement based on the target source code and the corresponding target resource dependency package.
[0006] Optionally, the configuration information further includes parameter configuration information of the build tool for the project source code, the file type of the target file, the file path of the target file, and the file path of non-target files. Parsing the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table includes: parsing the source code in the target file of the project source code according to the parameter configuration information of the build tool for the project source code, the file type of the target file, the file path of the target file, and the file path of non-target files to obtain the abstract syntax tree; marking each node of the abstract syntax tree to obtain an identifier for each node, the identifier at least indicating whether the source code corresponding to the node is the target source code; and generating the mapping cache table according to the abstract syntax tree and the identifiers of each node in the abstract syntax tree, the mapping cache table being used to store the mapping relationship between the target source code and the target resource dependency package.
[0007] Optionally, generating the mapping cache table based on the abstract syntax tree and the identifiers of each node in the abstract syntax tree includes: generating a first mapping relationship and a second mapping relationship based on the abstract syntax tree and the identifiers of each node in the abstract syntax tree, wherein the first mapping relationship is a mapping relationship between a first target source code and the project resource dependency package, and the second mapping relationship is a mapping relationship between a second target source code and the non-project resource dependency package, wherein the first target source code is the source code that needs to import the corresponding project resource dependency package, and the second target source code is the source code that needs to import the corresponding non-project resource dependency package; determining the reference count of each project resource dependency package and the reference count of each non-project resource dependency package based on the first mapping relationship and the second mapping relationship; and determining the mapping cache table based on the first mapping relationship, the second mapping relationship, and the reference counts of each project resource dependency package and the non-project resource dependency packages.
[0008] Optionally, the build tool is either the Webpack build tool or the Vite build tool.
[0009] Optionally, determining the target resource dependency package corresponding to the target source code by matching the nodes in the abstract syntax tree with the project resource dependency package and the non-project resource dependency package according to the mapping cache table includes: traversing and analyzing the code structure of the abstract syntax tree using a traversal tool to identify a first target node and a second target node, wherein the first target node is the node corresponding to the source code that requires the project resource dependency package, and the second target node is the node corresponding to the source code that requires the non-project resource dependency package; matching the first target node with the project resource dependency package using the KMP algorithm according to the mapping cache table to obtain a first matching result, and matching the second target node with the non-project resource dependency package to obtain a second matching result; performing context analysis on the first matching result and the second matching result to obtain a first analysis result and a second analysis result; determining the project resource dependency package corresponding to the first target source code according to the first analysis result, and determining the non-project resource dependency package corresponding to the second target source code according to the second analysis result.
[0010] Optionally, based on the mapping cache table, the KMP algorithm is used to perform letter string matching between the first target node and the project resource dependency package to obtain a first matching result, and the second target node is used to perform letter string matching between the non-project resource dependency package to obtain a second matching result. This includes: determining the weight of each project resource dependency package and the weight of each non-project resource dependency package based on the reference counts of each project resource dependency package and each non-project resource dependency package recorded in the mapping cache table; using the KMP algorithm to sequentially perform letter string matching between all project resource dependency packages and the first target node in descending order of weight to obtain the first matching result; and using the KMP algorithm to sequentially perform letter string matching between all non-project resource dependency packages and the second target node in descending order of weight to obtain the second matching result.
[0011] Optionally, generating a corresponding resource import statement based on the target source code and the corresponding target resource dependency package includes: determining the target resource dependency package and its address based on the target source code; generating a corresponding import statement based on the target resource dependency package and its address; and inserting the import statement into a preset position, where the preset position is either the top of the target file's code or a position corresponding to the target source code.
[0012] According to another aspect of this application, an automated resource import statement generation apparatus is provided, comprising: an acquisition unit, configured to acquire configuration information of project source code, and parse the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table; the configuration information includes project resource dependency packages and non-project resource dependency packages, wherein the project resource dependency packages are resource dependency packages included in the project source code, and the non-project resource dependency packages are resource dependency packages not included in the project source code; the target file is a file including target source code, the target source code is source code that needs to import the corresponding target resource dependency package, and the target resource dependency package is either the project resource dependency package or the non-project resource dependency package; a determination unit, configured to perform letter string matching between nodes in the abstract syntax tree and the project resource dependency package and the non-project resource dependency package according to the mapping cache table to determine the target resource dependency package corresponding to the target source code; and a generation unit, configured to generate a corresponding resource import statement according to the target source code and the corresponding target resource dependency package.
[0013] According to another aspect of this application, a computer-readable storage medium is provided, the computer-readable storage medium including a stored program, wherein, when the program is executed, it controls the device where the computer-readable storage medium is located to execute any of the described automatic generation methods for resource import statements.
[0014] According to another aspect of this application, an electronic device is provided, comprising: one or more processors, a memory, and one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the one or more processors, the one or more programs including an automated generation method for executing any of the resource import statements described above.
[0015] Applying the technical solution of this application, the above-mentioned automated generation method for resource import statements first obtains the configuration information of the project source code, and then parses the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependency packages and non-project resource dependency packages. Project resource dependency packages are those included in the project source code, and non-project resource dependency packages are those not included in the project source code. The target file is a file containing the target source code, and the target source code is the source code that needs to import the corresponding target resource dependency package. The target resource dependency package can be either a project resource dependency package or a non-project resource dependency package. According to the mapping cache table, the nodes in the abstract syntax tree are matched with the project resource dependency packages and non-project resource dependency packages using letter string matching to determine the target resource dependency package corresponding to the target source code. Based on the target source code and the corresponding target resource dependency package, the corresponding resource import statement is generated. This method provides Vue project developers with an efficient and automated dependency management solution, promoting front-end development towards a more efficient and optimized direction. It solves the problem that in existing technologies, resource import in Vue projects requires manually writing import statements, which is tedious and has low code readability and maintainability. Attached Figure Description
[0016] The accompanying drawings, which form part of this application, are used to provide a further understanding of this application. The illustrative embodiments and descriptions of this application are used to explain this application and do not constitute an undue limitation of this application. In the drawings:
[0017] Figure 1 A hardware structure block diagram of a mobile terminal for an automated generation method of executing resource import statements according to an embodiment of this application is shown.
[0018] Figure 2 A flowchart illustrating an automated method for generating resource import statements according to an embodiment of this application is shown.
[0019] Figure 3 A flowchart illustrating the construction process of a front-end packaging tool for an automated generation method of resource import statements according to an embodiment of this application is shown.
[0020] Figure 4 The diagram illustrates the overall architecture of a method for automatically generating resource import statements according to an embodiment of this application.
[0021] Figure 5 A flowchart illustrating the parsing module processing of an automated resource import statement generation method according to an embodiment of this application is shown.
[0022] Figure 6A flowchart illustrating the matching module processing of an automated resource import statement generation method according to an embodiment of this application is shown.
[0023] Figure 7 A flowchart illustrating the import module processing of an automated resource import statement generation method according to an embodiment of this application is shown.
[0024] Figure 8 A structural block diagram of an automated resource import statement generation apparatus provided according to an embodiment of this application is shown.
[0025] The above figures include the following reference numerals:
[0026] 102. Processor; 104. Memory; 106. Transmission device; 108. Input / output device. Detailed Implementation
[0027] It should be noted that, unless otherwise specified, the embodiments and features described in this application can be combined with each other. This application will now be described in detail with reference to the accompanying drawings and embodiments.
[0028] To enable those skilled in the art to better understand the present application, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present application, and not all embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative effort should fall within the scope of protection of the present application.
[0029] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate for the embodiments of this application described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.
[0030] For ease of description, the following explains some of the nouns or terms used in the embodiments of this application:
[0031] `import`: A declarative statement used to import members (such as functions, objects, primitive values, etc.) exported from other modules. By using the `import` statement, developers can access and use functionality or data provided by other modules within the current module.
[0032] Modularization: Modularization is an important feature of the JavaScript language, which allows developers to divide code into multiple independent, reusable modules, thereby improving code maintainability and manageability.
[0033] Webpack is a static module bundler for modern JavaScript applications. When Webpack processes an application, it internally builds a dependency graph from one or more entry points, and then combines each module needed in the project into one or more bundles for static resources used for content presentation.
[0034] Vite is a new type of front-end build tool that significantly improves the front-end development experience. It mainly consists of two parts: a development server that provides rich built-in functionality based on native Elasticsearch modules, such as incredibly fast Hot Modular Reload (HMR); and a set of build instructions that uses Rollup to bundle code and is pre-configured to output highly optimized static resources for production environments.
[0035] AST (Abstract Syntax Tree) is an abstract representation of the syntactic structure of source code. It represents the syntactic structure of a programming language in a tree-like format. It consists of a set of nodes, each representing a structure in the source code. Different structures are distinguished by types, common types include: identifiers, binary expressions, variable definitions, function definitions, etc.
[0036] Bundle: Bundle is a term in webpack that refers to a collection of different function blocks that contain the final version of the source code after it has been processed by webpack.
[0037] Hooks are commonly used in modern front-end development module bundlers, which offer powerful extensibility, allowing developers to customize and extend the build process through hooks. Hooks are a mechanism in these tools that allows user-defined logic to be inserted at specific points in the build process.
[0038] As described in the background section, the existing technology has the following drawbacks:
[0039] a) Manual import is tedious: Developers need to manually write import statements for each non-globally used component, API, icon, etc., which not only increases the coding workload, but also easily leads to omissions and errors.
[0040] b) Project size bloat: Without on-demand import, the project package size may become too large due to the inclusion of a large amount of unused code, affecting loading time and user experience.
[0041] c) Reduced development efficiency: Frequent manual import operations interrupt the developer's train of thought and reduce coding efficiency, especially when there are many dependency packages.
[0042] d) Increased maintenance difficulty: As projects grow, manually managed dependencies become difficult to maintain, especially in large-scale collaborative projects, where code readability and maintainability are affected.
[0043] e) Increased build time: Manually imported dependency packages may not be optimized, causing the build process to process more code, thus extending the build time.
[0044] To address the problem that importing resources into Vue projects in the prior art requires manually writing import statements, which is tedious and results in low code readability and maintainability, embodiments of this application provide an automated method for generating resource import statements, an automated device for generating resource import statements, a computer-readable storage medium, and an electronic device.
[0045] The technical solutions of the present invention will be clearly and completely described below with reference to the accompanying drawings in the embodiments of the present invention.
[0046] The methods and embodiments provided in this application can be executed on a mobile terminal, computer terminal, or similar computing device. Taking running on a mobile terminal as an example, Figure 1 This is a hardware structure block diagram of a mobile terminal for an automated resource import statement generation method according to an embodiment of the present invention. For example... Figure 1 As shown, a mobile terminal may include one or more ( Figure 1 Only one is shown in the diagram. A processor 102 (which may include, but is not limited to, a microprocessor MCU or a programmable logic device FPGA, etc.) and a memory 104 for storing data are also shown. The mobile terminal may further include a transmission device 106 for communication functions and an input / output device 108. Those skilled in the art will understand that... Figure 1 The structure shown is for illustrative purposes only and does not limit the structure of the mobile terminal described above. For example, the mobile terminal may also include components that are more... Figure 1 The more or fewer components shown, or having the same Figure 1The different configurations shown.
[0047] The memory 104 can be used to store computer programs, such as application software programs and modules, like the computer program corresponding to the automated generation method of resource import statements in this embodiment of the invention. The processor 102 executes various functional applications and data processing by running the computer programs stored in the memory 104, thereby implementing the above-described method. The memory 104 may include high-speed random access memory and non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory 104 may further include memory remotely located relative to the processor 102, and these remote memories can be connected to the mobile terminal via a network. Examples of the aforementioned networks include, but are not limited to, the Internet, corporate intranets, local area networks, mobile communication networks, and combinations thereof. The transmission device 106 is used to receive or send data via a network. Specific examples of the aforementioned networks may include wireless networks provided by the mobile terminal's communication provider. In one example, the transmission device 106 includes a network interface controller (NIC), which can be connected to other network devices via a base station to communicate with the Internet. In one example, the transmission device 106 may be a radio frequency (RF) module, which is used to communicate with the Internet wirelessly.
[0048] This embodiment provides an automated method for generating resource import statements that run on a mobile terminal, computer terminal, or similar computing device. It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions. Furthermore, although a logical order is shown in the flowchart, in some cases, the steps shown or described may be executed in a different order than that shown here.
[0049] Figure 2 This is a flowchart of a method for automatically generating resource import statements according to an embodiment of this application. For example... Figure 2 As shown, the method includes the following steps:
[0050] Step S201: Obtain the configuration information of the project source code, and parse the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table; the configuration information includes project resource dependency packages and non-project resource dependency packages, the project resource dependency packages are resource dependency packages included in the project source code, the non-project resource dependency packages are resource dependency packages not included in the project source code, the target file is a file containing target source code, the target source code is the source code that needs to import the corresponding target resource dependency package, and the target resource dependency package is the project resource dependency package or the non-project resource dependency package;
[0051] Specifically, this step involves reading user configuration information during project startup or build packaging, such as the auto-import plugin configuration defined in the `vue.config.js` file in a Vue project or the `vite.config.ts` file in a Vite project. This configuration includes information such as the file type to be parsed, the source code file path, and the preset APIs of third-party libraries. Using this information, the tool parses the source code in the target file, generating an Abstract Syntax Tree (AST) and a dependency mapping cache table. The AST represents the syntactic structure of the source code, while the dependency mapping cache table records the import frequency and weight of global methods and third-party library APIs, ensuring the accuracy and consistency of resource imports. By automatically parsing and generating dependency mappings, the tediousness of manually managing dependencies is reduced, improving code maintainability and readability. Simultaneously, the weight recording optimizes the efficiency of subsequent resource matching and import.
[0052] Step S202: Based on the above mapping cache table, perform letter string matching between the nodes in the above abstract syntax tree and the above project resource dependency package and the above non-project resource dependency package to determine the above target resource dependency package corresponding to the above target source code;
[0053] Specifically, the matching module uses the KMP algorithm to analyze the node types in the AST syntax tree, such as identifying ImportDeclaration nodes (for static imports) and CallExpression or MemberExpression nodes (for identifying possible API calls). By comparing with the contents of the dependency mapping cache table, the tool can quickly identify and locate resource references that are not explicitly imported, such as global variables, function or method calls, and API usage of third-party libraries. Through this intelligent matching process, this invention can automatically identify and manage various resource references, avoiding development problems caused by omissions or incorrect dependency introductions, and improving development efficiency and project build reliability.
[0054] Step S203: Generate the corresponding resource import statement based on the target source code and the corresponding target resource dependency package.
[0055] Specifically, the import module is responsible for generating corresponding import statements for global methods and other resources in the project based on the processing results of the matching module, and automatically inserting them at the top of the source code or at a specified location. This dynamic insertion process is completely automated, requiring no additional action from developers, ensuring the real-time nature and accuracy of resource imports. Automated resource import statement generation not only reduces the workload of manually writing import statements but also avoids human error, further improving development efficiency and code quality, and enabling dynamic code optimization and modular management.
[0056] In this embodiment, the development language Vue is a JavaScript framework. When it finally runs on the browser, it needs to go through a series of processing steps. These steps involve the compilation, packaging, loading and execution of Vue code. The processing of these processes usually depends on packaging and building tools such as Webpack and Vite.
[0057] During initialization, Webpack reads configuration files, such as webpack.config.js, initializes the Compiler object, recursively scans the entry file and its dependencies, and builds a dependency graph. During this process, Webpack accesses the file system to locate and identify resource files in the project. Vite utilizes the browser to parse module imports in Elasticsearch. When the browser requests a module, it compiles that module. During the development phase, a local development server is started, and in development mode, it scans the project directory to identify source code files.
[0058] Webpack and Vite bundle Vue. Both of these build methods generally involve a code compilation phase. These tools offer a wealth of hooks, allowing users to insert custom logic at different stages of the plugin build process.
[0059] Both Webpack and Vite, as build methods, involve a code compilation phase. These tools offer a wealth of hooks, allowing users to insert custom logic at different stages of the plugin build process. The build process is as follows: Figure 3 As shown, first initialize the parameters to prepare for compilation; after starting compilation, select the corresponding compilation module; after selecting the corresponding compilation module, output the resources after compilation is completed; finally, write the output resources to a file.
[0060] This application leverages the hooks capability of build tools—specifically, the ability to insert statements—to read source code. During the initial project runtime phase, configuration parsing and processing are performed, and an AST parser scans all source code files in the project. Upon initial project run, a dependency mapping cache table is recursively generated based on information such as global methods, APIs, and common application modules. Dependencies to be imported in the source code are tagged, and the mapping cache table is matched to find un-explicitly imported global variables. Based on the matching results, corresponding import statements are generated, and the final output is given.
[0061] This application mainly consists of three modules: a parsing module, a matching module, and an import module. The overall architecture design is as follows: Figure 4 As shown, the final result is the import statement for third-party dependencies in the Vue project. The import statement is used to import the third-party dependency packages of the Vue project, but not to import the Vue project itself.
[0062] The parsing module is primarily responsible for reading user configurations, specifically the paths to be parsed, and receiving parameter configuration information from the user's build tools, as well as preset configurations for third-party library APIs. The build tools refer to Webpack and Vite, essential tools for building and running Vue projects. These are the default open-source tools for Vue development, with Webpack and Vite being the preferred choices. The build tools are downloaded from the open-source npm repository and installed directly using npm during project setup. The parameter configuration information refers to the basic configuration parameters that Webpack and Vite provide during project use, such as whether to bundle the project into chunks, whether to compress the code, the code parsing path, the file types included in the parsed code, and file paths. This information allows the build tools to perform different processing on the project and code during the build process. The preset configuration information for third-party library APIs refers to commonly used dependency libraries in front-end project development, such as Vue, Vue-router, and axios. This preset configuration information uses object syntax to define the content that these third-party libraries should be automatically imported. Other information includes: automatically imported file types, file paths to be processed, sources of third-party dependency libraries, alias information, and custom comment information. Ignoreable file resolution paths refer to files categorized by file type in the front-end project. Files such as CSS and images do not need to be automatically imported; these are configured in the ignore-for-resolution file configuration, and will be automatically ignored during code processing, only processing files that require automatic dependency import. The core processing flow of the resolution module is to analyze and filter the project's dependencies, static resources, utility methods, third-party library APIs, and global methods during the initial project run and packaging, generating a dependency mapping cache table stored locally.
[0063] The matching module is the core of this application. The build tool uses a syntax parser to convert the source code into an AST structure, and the matching module uses Babel's traverse tool to traverse and analyze the AST code structure. During traversal, specific AST nodes are identified, such as the ImportDeclaration node (for static imports) and CallExpression or MemberExpression nodes (for identifying possible API calls). Based on the contents of the mapping cache table generated during the parsing phase, the matching module matches references in the code, such as identifiers in CallExpression or MemberExpression, against a predefined list of modules and APIs using the KMP algorithm. For each matched dependency resource reference, the matching module performs context analysis to determine whether the reference actually needs to be imported. The matching results are recorded in the mapping cache table, and the next module relies on these records to generate references. These records are also applied to the base dependencies at the next startup, accelerating the matching speed after project startup and source code modifications.
[0064] The import module is responsible for generating the corresponding import statements for the application's global methods based on the results processed by the matching module.
[0065] The automated resource import statement generation method of this application first obtains the configuration information of the project source code, and then parses the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependencies and non-project resource dependencies. Project resource dependencies are those included in the project source code, and non-project resource dependencies are those not included in the project source code. The target file is a file containing the target source code, which is the source code that needs to import the corresponding target resource dependency. The target resource dependency can be either a project resource dependency or a non-project resource dependency. According to the mapping cache table, the nodes in the abstract syntax tree are matched with the project resource dependencies and non-project resource dependencies by letter string matching to determine the target resource dependency corresponding to the target source code. Based on the target source code and the corresponding target resource dependency, the corresponding resource import statement is generated. This method provides Vue project developers with an efficient and automated dependency management solution, promoting the development of front-end development towards a more efficient and optimized direction. It solves the problem that in existing technologies, resource import in Vue projects requires manual writing of import statements, which is tedious and has low code readability and maintainability.
[0066] In some embodiments, the configuration information also includes parameter configuration information of the build tool for the project source code, the file type of the target file, the file path of the target file, and the file paths of non-target files; parsing the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table includes the following steps:
[0067] Step S301: Based on the parameter configuration information of the above project source code build tool, the file type of the above target file, the file path of the above target file and the file path of the non-target file, parse the source code in the target file of the above project source code to obtain the above abstract syntax tree.
[0068] Step S302: Mark each node of the above abstract syntax tree to obtain the identifier of each node. The identifier at least indicates whether the source code corresponding to the above node is the target source code.
[0069] Step S303: Based on the above abstract syntax tree and the identifiers of each of the above nodes in the above abstract syntax tree, generate the above mapping cache table. The above mapping cache table is used to store the mapping relationship between the above target source code and the above target resource dependency package.
[0070] Among them, such as Figure 5 As shown, the parsing module will process the data in the following steps:
[0071] ① Reading User Configuration: Using this invention requires prior configuration in the project. Configuration includes the file type to be parsed, the path to the source code file to be parsed, the default API content of third-party libraries, and ESLint configuration information. The ESLint configuration information is a code formatting tool to ensure no errors are reported.
[0072] ② Source Code Parsing: The source code parsing step performs syntax analysis on the target file of the source code to be parsed. This step involves parsing the content of the source code into an AST (Abstract Syntax Tree) after it has been transformed by the build tool, and then marking the nodes in the syntax tree according to their type identifiers. The source code parsing stage mainly processes the source code in the project, and after parsing the source code, an AST syntax tree is obtained. The marking content mainly marks the reference locations of third-party dependency packages: the name of the third-party library, the reference location in the source code, and the name of the referenced method;
[0073] ③ Generate Mapping Cache Table: Generating the mapping cache table is the core of this module. It involves parsing the source code and marking the locations of resources to be imported. Additionally, it creates index maps for pre-defined APIs of third-party libraries and records their reference counts; it also creates index maps for global methods exported by the current project and records their reference counts. By tracking the reference counts of each function or method, hot functions are identified and assigned different weights. These weights serve as the core basis for retrieving and inserting resources in the source code, improving efficiency when automatically importing dependent resources later. After obtaining the reference count, a hierarchical rule is used to convert the "number of times" into a "weight value." The core logic is that the more frequently a resource is referenced, the higher its weight. A tiered hierarchical system is used: a fixed threshold for the number of references is set, with different weights corresponding to different ranges. References of 0-5 times have a weight of 1, 6-20 times have a weight of 3, and over 20 times have a weight of 5. Using weight values as the core basis essentially solves the problems of "retrieval efficiency" and "accuracy" during automated import by prioritizing high-weight resources, reducing the search scope, lowering the false positive rate, and optimizing the efficiency of import statement generation.
[0074] In this embodiment, the configuration information not only covers the build tool parameters for the project source code, but also includes the type and path of the target files, as well as exclusion rules for non-target file paths. By comprehensively utilizing this configuration information, the target files of the project source code are parsed to generate an Abstract Syntax Tree (AST). During the AST construction process, each node is marked to identify whether the source code corresponding to the node belongs to the target source code. Subsequently, based on the AST and node identifiers, a mapping cache table is generated, which accurately records the mapping relationship between the target source code and the target resource dependency packages. The core of this design lies in achieving intelligent association between source code and dependency packages through automated analysis and marking, avoiding the complexity and potential errors of manual configuration, and significantly improving code maintainability and project build efficiency. The generation and maintenance of the mapping cache table ensures the accuracy and consistency of resource import, laying a solid foundation for subsequent automatic resource matching and import. In addition, by excluding non-target file paths and focusing on the processing of key files, the resource import process is further optimized, reducing unnecessary processing overhead.
[0075] In some embodiments, the mapping cache table is generated based on the abstract syntax tree and the identifiers of each node in the abstract syntax tree, including the following steps:
[0076] Step S401: Based on the above abstract syntax tree and the identifiers of each node in the above abstract syntax tree, generate a first mapping relationship and a second mapping relationship. The first mapping relationship is the mapping relationship between the first target source code and the project resource dependency package. The second mapping relationship is the mapping relationship between the second target source code and the non-project resource dependency package. The first target source code is the source code that needs to import the corresponding project resource dependency package. The second target source code is the source code that needs to import the corresponding non-project resource dependency package.
[0077] Step S402: Based on the first mapping relationship and the second mapping relationship, determine the number of references for each of the above-mentioned project resource dependency packages and the number of references for each of the above-mentioned non-project resource dependency packages;
[0078] Step S403: Determine the mapping cache table based on the first mapping relationship, the second mapping relationship, the number of references to each of the project resource dependency packages, and the number of references to each of the non-project resource dependency packages.
[0079] In this embodiment, the generation process of the dependency mapping cache table is further refined for the automated import and on-demand loading solution of Vue project resources. Specifically, by analyzing the Abstract Syntax Tree (AST) and its node identifiers, this solution generates a first mapping relationship and a second mapping relationship. The former associates the source code within the project with the required project resource dependencies, while the latter associates the source code with non-project resource dependencies. Based on these mapping relationships, the reference frequency of project resource dependencies and non-project resource dependencies is statistically determined. Finally, the construction of the mapping cache table integrates the above mapping relationships and reference counts, providing key data support for subsequent resource matching and automated import, ensuring accurate resource import and efficient project operation. This design not only simplifies dependency management but also optimizes code loading efficiency, improving the development experience and application performance.
[0080] In some embodiments, the build tool described above is either the Webpack build tool or the Vite build tool.
[0081] The build tools mentioned here refer to Webpack and Vite, which are essential tools for building and running Vue projects. These build tools are the default open-source tools for Vue development, with Webpack and Vite being the preferred choices. They are downloaded from the open-source npm repository and can be installed directly using npm when setting up the project.
[0082] In this embodiment, the build tool is either Webpack or Vite. This choice gives the solution of the present invention a high degree of compatibility and flexibility, enabling seamless integration into various front-end development environments. Whether Webpack uses a dependency graph for code splitting and optimization, or Vite leverages the browser's ES module parsing capabilities and fast module hot-update features, both can effectively analyze and import necessary resources automatically during project startup or build, without requiring developers to manually write import statements. This design not only significantly reduces development workload and improves code cleanliness and maintainability, but also effectively controls project size, optimizes loading speed, and enhances user experience through automated import and on-demand loading mechanisms. Regardless of the build method used, the accuracy and efficiency of resource import are ensured, providing strong support for front-end development.
[0083] In some embodiments, the target resource dependency package corresponding to the target source code is determined by matching the nodes in the abstract syntax tree with the project resource dependency package and the non-project resource dependency package according to the mapping cache table, including the following steps:
[0084] Step S501: Use a traversal tool to traverse and analyze the code structure of the above abstract syntax tree to identify the first target node and the second target node. The first target node is the node corresponding to the source code that requires the above project resource dependency package, and the second target node is the node corresponding to the source code that requires the above non-project resource dependency package.
[0085] Step S502: Based on the above mapping cache table, the KMP algorithm is used to match the first target node with the project resource dependency package to obtain the first matching result, and the second target node is matched with the non-project resource dependency package to obtain the second matching result.
[0086] Step S503: Perform context analysis on the first matching result and the second matching result to obtain the first analysis result and the second analysis result;
[0087] Step S504: Based on the first analysis result, determine the project resource dependency package corresponding to the first target source code, and based on the second analysis result, determine the non-project resource dependency package corresponding to the second target source code.
[0088] The matching module processing flow is as follows: Figure 6As shown, the matching module relies on a mapping cache table when performing reference matching. For references not found in the cache, it throws an exception and interrupts the current processing logic, providing the user with information such as the exception's package name and file path in the terminal for troubleshooting. After the user manually adjusts the dependency package information, the mapping cache table is updated during the next startup or build phase. If the number of automatically imported libraries and components is large, it can be difficult to view reference relationships. Therefore, the mapping cache table generates cache files stored locally on the project, facilitating reference relationship investigation and problem localization.
[0089] This embodiment addresses the solution for automated resource import and on-demand loading in Vue projects. By employing AST parsing and the KMP algorithm, it achieves precise matching and automated insertion of dependency resources not explicitly imported in the project's source code. The core of this solution lies in its initial generation of a dependency mapping cache table through a parsing module. This table identifies global methods, APIs, and public modules within the project and records their reference frequency in the source code, using this information to allocate resource weights. Subsequently, in the matching module, the generated mapping cache table is used to perform string matching on target nodes in the abstract syntax tree using traversal tools and the KMP algorithm. This distinguishes between references to resources within and outside the project, performs context analysis to determine whether import is truly necessary, and generates the corresponding import statements. In this way, the solution not only effectively reduces the tedious manual importing of dependencies by developers but also optimizes the matching process based on resource usage frequency, improving project startup speed and build efficiency. Furthermore, the automated import mechanism ensures code readability and maintainability, reduces error rates, and provides a more efficient and intelligent solution for the development and maintenance of Vue projects.
[0090] In some embodiments, based on the above-mentioned mapping cache table, the KMP algorithm is used to perform letter string matching between the first target node and the project resource dependency package to obtain a first matching result, and the second target node is matched with the non-project resource dependency package to obtain a second matching result, including the following steps:
[0091] Step S601: Based on the number of references to each of the above-mentioned project resource dependency packages and the number of references to each of the above-mentioned non-project resource dependency packages recorded in the above-mentioned mapping cache table, determine the weight of each of the above-mentioned project resource dependency packages and the weight of each of the above-mentioned non-project resource dependency packages.
[0092] Step S602: Using the KMP algorithm described above, all the above-mentioned project resource dependency packages are matched with the above-mentioned first target node in descending order of weight to obtain the above-mentioned first matching result;
[0093] Step S603: Using the KMP algorithm described above, all the non-project resource dependency packages are matched with the second target node in descending order of weight to obtain the second matching result.
[0094] In this embodiment, based on the mapping cache table, the KMP algorithm is used to perform letter string matching between the first target node and the project resource dependency packages to obtain a first matching result, and the second target node is matched with the non-project resource dependency packages to obtain a second matching result. Specifically, based on the reference counts of each project resource dependency package and each non-project resource dependency package recorded in the mapping cache table, the weights of each project resource dependency package and each non-project resource dependency package are determined. The KMP algorithm is used to match all project resource dependency packages with the first target node in descending order of weight to obtain a first matching result; the KMP algorithm is used to match all non-project resource dependency packages with the second target node in descending order of weight to obtain a second matching result. This process can effectively improve the accuracy and speed of resource introduction, avoid matching errors caused by similar resource names in the traditional mode, and at the same time, the weight-sorting matching strategy can prioritize the processing of frequently referenced resources, further optimizing the efficiency of resource introduction and ensuring more efficient and accurate resource management of the front-end project.
[0095] In some embodiments, based on the target source code and the corresponding target resource dependency package, a corresponding resource import statement is generated, including the following steps:
[0096] Step S701: Based on the target source code, determine the target resource dependency package and the address of the target resource dependency package.
[0097] Step S702: Based on the target resource dependency package and its address, generate a corresponding import statement and insert the import statement into a preset position, which is either the top of the target file's code or a position corresponding to the target source code.
[0098] Among them, such as Figure 7 As shown, the scanning module mainly involves the following key steps during processing:
[0099] ① Scan files: Based on the matching results of the dependency mapping cache table, tagging information is introduced for the dependencies of the source code to determine the resources to be introduced and their reference addresses; among them, the tagging information corresponds to the marking information of the node types in the syntax tree in the source code parsing steps of the parsing module in the detailed description of the technical solution.
[0100] ② Based on the scan results, create an import statement;
[0101] ③ Insert the import statement at the top of the code or at a specified location.
[0102] The input data for this module is a list of modules and methods to be imported, and the output data is the modified source code text.
[0103] In this embodiment, the automated import and on-demand loading solution significantly optimizes resource management for Vue projects. Specifically, during project initialization or build phases, the solution accurately identifies and locates resources not explicitly imported in the source code and their reference addresses through a dependency mapping cache table generated by the parsing module. This process ensures the accuracy and consistency of resource imports. Subsequently, in the matching module, a strategy combining AST syntax tree analysis with the KMP algorithm and resource reference weights is employed to quickly and efficiently match referenced resources in the source code, reducing matching time and improving project startup and refactoring speed. Finally, in the import module phase, corresponding import statements are generated based on the matching results and precisely inserted at the top of the code or a preset position, achieving automated code optimization and resource import. This overall solution not only greatly simplifies developers' resource import operations and improves development efficiency but also facilitates later project maintenance and management, reducing errors caused by manual resource imports and ensuring code quality and project robustness. As the development process progresses, the mapping cache table is continuously updated, making resource management more dynamic and intelligent, providing Vue projects with a comprehensive and automated resource import solution.
[0104] Without the solution and tools described in this application, the import of project dependencies must be done manually, which may lead to errors such as incorrect resource location imports or missing resources. Manually managed dependencies are also difficult to maintain, prone to errors, and negatively impact developer efficiency. Compared to solutions that automatically register front-end project dependencies by matching and registering dependencies through the package.json dependency file, this application is compatible with multiple packaging methods, supports automated imports, and uses a single tool to integrate various resource import solutions, improving project configuration efficiency, streamlining cumbersome configuration items, and allowing developers to focus more on code logic. Automated package imports automatically analyze project source code, identify and import required libraries and components without manual intervention from developers, thereby improving development efficiency and reducing error rates.
[0105] It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions, and although a logical order is shown in the flowchart, in some cases the steps shown or described may be executed in a different order than that shown here.
[0106] This application also provides an automated resource import statement generation apparatus. It should be noted that this apparatus can be used to execute the automated resource import statement generation method provided in this application. This apparatus is used to implement the above embodiments and preferred embodiments; details already described will not be repeated. As used below, the term "module" can refer to a combination of software and / or hardware that performs a predetermined function. Although the apparatus described in the following embodiments is preferably implemented in software, hardware implementation, or a combination of software and hardware, is also possible and contemplated.
[0107] The following describes the automated generation device for resource import statements provided in the embodiments of this application.
[0108] Figure 8 This is a schematic diagram of an automated resource import statement generation apparatus according to an embodiment of this application. For example... Figure 8 As shown, the device includes: an acquisition unit 10, a determination unit 20, and a generation unit 30. The acquisition unit 10 is used to acquire configuration information of the project source code and parse the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependency packages and non-project resource dependency packages. The project resource dependency packages are resource dependency packages included in the project source code, and the non-project resource dependency packages are resource dependency packages not included in the project source code. The target file is a file containing the target source code, and the target source code is the source code that needs to import the corresponding target resource dependency package. The target resource dependency package is either the project resource dependency package or the non-project resource dependency package. The determination unit 20 is used to perform letter string matching between the nodes in the abstract syntax tree and the project resource dependency package and the non-project resource dependency package according to the mapping cache table to determine the target resource dependency package corresponding to the target source code. The generation unit 30 is used to generate a corresponding resource import statement according to the target source code and the corresponding target resource dependency package.
[0109] The automated resource import statement generation device of this application includes an acquisition unit, a determination unit, and a generation unit. The acquisition unit acquires configuration information of the project source code and parses the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependencies and non-project resource dependencies. Project resource dependencies are those included in the project source code, and non-project resource dependencies are those not included in the project source code. The target file is a file containing the target source code, which is the source code that needs to import the corresponding target resource dependency. The target resource dependency can be either a project resource dependency or a non-project resource dependency. The determination unit matches the nodes in the abstract syntax tree with the project resource dependencies and non-project resource dependencies using the mapping cache table to determine the target resource dependency corresponding to the target source code. The generation unit generates the corresponding resource import statement based on the target source code and the corresponding target resource dependency. This method can provide Vue project developers with an efficient and automated dependency management solution, promoting front-end development towards a more efficient and optimized direction. This addresses the problem that in existing technologies, resource import in Vue projects requires manually writing import statements, which is tedious and results in low code readability and maintainability.
[0110] In some embodiments, the configuration information further includes parameter configuration information of the build tool for the project source code, the file type of the target file, the file path of the target file, and the file path of non-target files. The acquisition unit includes a first acquisition module, a second acquisition module, and a first generation module. The first acquisition module is used to parse the source code in the target file of the project source code according to the parameter configuration information of the build tool for the project source code, the file type of the target file, the file path of the target file, and the file path of non-target files to obtain the abstract syntax tree. The second acquisition module is used to mark each node of the abstract syntax tree to obtain the identifier of each node. The identifier at least indicates whether the source code corresponding to the node is the target source code. The first generation module is used to generate the mapping cache table according to the abstract syntax tree and the identifiers of each node in the abstract syntax tree. The mapping cache table is used to store the mapping relationship between the target source code and the target resource dependency package. This optimizes the resource import process and reduces unnecessary processing overhead.
[0111] In some embodiments, the first generation module includes a second generation module, a first determining module, and a second determining module. The second generation module is used to generate a first mapping relationship and a second mapping relationship based on the abstract syntax tree and the identifiers of each node in the abstract syntax tree. The first mapping relationship is a mapping relationship between a first target source code and the project resource dependency package, and the second mapping relationship is a mapping relationship between a second target source code and the non-project resource dependency package. The first target source code is the source code that needs to import the corresponding project resource dependency package, and the second target source code is the source code that needs to import the corresponding non-project resource dependency package. The first determining module is used to determine the reference count of each project resource dependency package and the reference count of each non-project resource dependency package based on the first and second mapping relationships. The second determining module is used to determine the mapping cache table based on the first and second mapping relationships, the reference count of each project resource dependency package, and the reference count of each non-project resource dependency package. This simplifies dependency management, optimizes code loading efficiency, and improves development experience and application performance.
[0112] In some embodiments, the aforementioned build tool is either Webpack or Vite. This ensures the accuracy and efficiency of resource import, providing strong support for front-end development.
[0113] In some embodiments, the determining unit includes a third acquisition module, a fourth acquisition module, a fifth acquisition module, and a third determining module. The third acquisition module is used to traverse and analyze the code structure of the abstract syntax tree using a traversal tool to identify a first target node and a second target node. The first target node is the node corresponding to the source code that requires the project resource dependency package, and the second target node is the node corresponding to the source code that requires the non-project resource dependency package. The fourth acquisition module is used to perform letter string matching between the first target node and the project resource dependency package using the KMP algorithm according to the mapping cache table to obtain a first matching result, and to perform letter string matching between the second target node and the non-project resource dependency package to obtain a second matching result. The fifth acquisition module is used to perform context analysis on the first matching result and the second matching result to obtain a first analysis result and a second analysis result. The third determining module is used to determine the project resource dependency package corresponding to the first target source code based on the first analysis result, and to determine the non-project resource dependency package corresponding to the second target source code based on the second analysis result. This not only effectively reduces the tedious operation of developers manually introducing dependencies, but also optimizes the matching process according to the resource usage frequency, improving project startup speed and build efficiency.
[0114] In some embodiments, the fourth acquisition module includes a fourth determination module, a sixth acquisition module, and a seventh acquisition module. The fourth determination module is used to determine the weight of each project resource dependency package and the weight of each non-project resource dependency package based on the reference counts of each project resource dependency package and the reference counts of each non-project resource dependency package recorded in the mapping cache table. The sixth acquisition module is used to use the KMP algorithm to sequentially match all project resource dependency packages with the first target node in descending order of weight to obtain the first matching result. The seventh acquisition module is used to use the KMP algorithm to sequentially match all non-project resource dependency packages with the second target node in descending order of weight to obtain the second matching result. This effectively improves the accuracy and speed of resource introduction and avoids matching errors caused by similar resource names in the traditional mode.
[0115] In some embodiments, the generation unit includes a fifth determining module and a third generation module. The fifth determining module is used to determine the target resource dependency package and its address based on the target source code. The third generation module is used to generate a corresponding import statement based on the target resource dependency package and its address, and insert the import statement into a preset position, which is either the top of the target file's code or a position corresponding to the target source code. This simplifies the developer's resource import operations, improves development efficiency, and also facilitates later project maintenance and management, reduces errors caused by manually importing resources, and ensures code quality and project robustness.
[0116] This embodiment provides an automated method for generating resource import statements that run on a mobile terminal, computer terminal, or similar computing device. It should be noted that the steps shown in the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer-executable instructions. Furthermore, although a logical order is shown in the flowchart, in some cases, the steps shown or described may be executed in a different order than that shown here.
[0117] The aforementioned automated resource import statement generation device includes a processor and a memory. The aforementioned determining units are all stored as program units in the memory, and the processor executes these program units stored in the memory to achieve the corresponding functions. All of the aforementioned modules reside in the same processor; alternatively, the aforementioned modules may be located in different processors in any combination.
[0118] The processor contains a kernel, which retrieves the corresponding program units from memory. One or more kernels can be configured. By adjusting kernel parameters, the problem of manually writing import statements for resources in existing Vue projects—a tedious process with low code readability and maintainability—can be solved.
[0119] The memory may include non-permanent memory in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM, and the memory includes at least one memory chip.
[0120] This invention provides a computer-readable storage medium including a stored program, wherein, when the program is running, it controls the device where the computer-readable storage medium is located to execute the automated generation method of the resource import statement.
[0121] This invention provides a processor for running a program, wherein the program executes the automated generation method for the resource import statement.
[0122] This invention provides a device, comprising one or more processors, a memory, and one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the one or more processors, and the one or more programs include an automated generation step for implementing the resource import statement described above. The device in this document may be a server, PC, PAD, mobile phone, etc.
[0123] This application also provides a computer program product that, when executed on a data processing device, is adapted to perform an automated generation method step that initializes at least resource import statements.
[0124] It is obvious to those skilled in the art that the modules or steps of the present invention described above can be implemented using general-purpose computing devices. They can be centralized on a single computing device or distributed across a network of multiple computing devices. They can be implemented using computer-executable program code, and thus can be stored in a storage device for execution by a computing device. In some cases, the steps shown or described can be performed in a different order than those described herein, or they can be fabricated as separate integrated circuit modules, or multiple modules or steps can be fabricated as a single integrated circuit module. Thus, the present invention is not limited to any particular combination of hardware and software.
[0125] Those skilled in the art will understand that embodiments of this application can be provided as methods, systems, or computer program products. Therefore, this application can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, this application can take the form of a computer program product embodied on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.
[0126] This application is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this application. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, generate instructions for implementing the flowchart... Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.
[0127] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The function specified in one or more boxes.
[0128] These computer program instructions may also be loaded onto a computer or other programmable data processing equipment to cause a series of operational steps to be performed on the computer or other programmable equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.
[0129] In a typical configuration, a computing device includes one or more processors (CPU), input / output interfaces, network interfaces, and memory.
[0130] Memory may include non-persistent memory in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, like read-only memory (ROM) or flash RAM. Memory is an example of computer-readable media.
[0131] Computer-readable media includes both permanent and non-permanent, removable and non-removable media that can store information using 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 technologies, CD-ROM, digital versatile optical disc (DVD) or other optical storage, magnetic tape, disk storage or other magnetic storage devices, or any other non-transferable medium that can be used to store information accessible by a computing device. As defined herein, computer-readable media does not include transient computer-readable media, such as modulated data signals and carrier waves.
[0132] It should also be noted that the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such process, method, article, or apparatus. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes that element.
[0133] As can be seen from the above description, the embodiments of this application achieve the following technical effects:
[0134] 1) The automated generation method for resource import statements in this application first obtains the configuration information of the project source code, and then parses the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependency packages and non-project resource dependency packages. Project resource dependency packages are those included in the project source code, and non-project resource dependency packages are those not included in the project source code. The target file is a file containing the target source code, and the target source code is the source code that needs to import the corresponding target resource dependency package. The target resource dependency package can be either a project resource dependency package or a non-project resource dependency package. According to the mapping cache table, the nodes in the abstract syntax tree are matched with the project resource dependency packages and non-project resource dependency packages using letter string matching to determine the target resource dependency package corresponding to the target source code. Based on the target source code and the corresponding target resource dependency package, the corresponding resource import statement is generated. This method provides Vue project developers with an efficient and automated dependency management solution, promoting the development of front-end development towards a more efficient and optimized direction. It solves the problem that in existing technologies, resource import in Vue projects requires manual writing of import statements, which is tedious and has low code readability and maintainability.
[0135] 2) The automated resource import statement generation device of this application includes an acquisition unit, a determination unit, and a generation unit. The acquisition unit acquires the configuration information of the project source code and parses the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependency packages and non-project resource dependency packages. Project resource dependency packages are those included in the project source code, and non-project resource dependency packages are those not included in the project source code. The target file is a file containing the target source code, and the target source code is the source code that needs to import the corresponding target resource dependency package. The target resource dependency package can be either a project resource dependency package or a non-project resource dependency package. The determination unit matches the nodes in the abstract syntax tree with the project resource dependency packages and non-project resource dependency packages according to the mapping cache table to determine the target resource dependency package corresponding to the target source code. The generation unit generates the corresponding resource import statement based on the target source code and the corresponding target resource dependency package. This device provides Vue project developers with an efficient and automated dependency management solution, promoting front-end development towards a more efficient and optimized direction. This addresses the problem that in existing technologies, resource import in Vue projects requires manually writing import statements, which is tedious and results in low code readability and maintainability.
[0136] The above description is merely a preferred embodiment of this application and is not intended to limit this application. Various modifications and variations can be made to this application by those skilled in the art. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the protection scope of this application.
Claims
1. A method for automatically generating resource import statements, characterized in that, include: The configuration information of the project source code is obtained, and the source code in the target file of the project source code is parsed according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependency packages and non-project resource dependency packages. The project resource dependency packages are resource dependency packages included in the project source code, and the non-project resource dependency packages are resource dependency packages not included in the project source code. The target file is a file containing the target source code. The target source code is the source code that needs to import the corresponding target resource dependency package. The target resource dependency package is either the project resource dependency package or the non-project resource dependency package. Based on the mapping cache table, the nodes in the abstract syntax tree are matched with the project resource dependency package and the non-project resource dependency package to determine the target resource dependency package corresponding to the target source code; Based on the target source code and the corresponding target resource dependency package, generate the corresponding resource import statement.
2. The method according to claim 1, characterized in that, The configuration information also includes the parameter configuration information of the build tool for the project source code, the file type of the target file, the file path of the target file, and the file path of non-target files; Based on the configuration information, the source code in the target file of the project source code is parsed to obtain an abstract syntax tree and a mapping cache table, including: Based on the parameter configuration information of the build tool for the project source code, the file type of the target file, the file path of the target file, and the file path of the non-target file, the source code in the target file of the project source code is parsed to obtain the abstract syntax tree; Each node of the abstract syntax tree is marked to obtain an identifier for each node, and the identifier at least indicates whether the source code corresponding to the node is the target source code; Based on the abstract syntax tree and the identifiers of each node in the abstract syntax tree, a mapping cache table is generated. The mapping cache table is used to store the mapping relationship between the target source code and the target resource dependency package.
3. The method according to claim 2, characterized in that, Based on the abstract syntax tree and the identifiers of each node in the abstract syntax tree, the mapping cache table is generated, including: Based on the abstract syntax tree and the identifiers of each node in the abstract syntax tree, a first mapping relationship and a second mapping relationship are generated. The first mapping relationship is the mapping relationship between the first target source code and the project resource dependency package. The second mapping relationship is the mapping relationship between the second target source code and the non-project resource dependency package. The first target source code is the source code that needs to import the corresponding project resource dependency package. The second target source code is the source code that needs to import the corresponding non-project resource dependency package. Based on the first mapping relationship and the second mapping relationship, determine the number of references for each project resource dependency package and the number of references for each non-project resource dependency package; The mapping cache table is determined based on the first mapping relationship, the second mapping relationship, the reference counts of each project resource dependency package, and the reference counts of each non-project resource dependency package.
4. The method according to claim 2, characterized in that, The build tool is either Webpack or Vite.
5. The method according to claim 1, characterized in that, Based on the mapping cache table, the nodes in the abstract syntax tree are matched with the project resource dependency packages and the non-project resource dependency packages using letter string matching to determine the target resource dependency package corresponding to the target source code, including: A traversal tool is used to traverse and analyze the code structure of the abstract syntax tree to identify a first target node and a second target node. The first target node is the node corresponding to the source code that requires the project resource dependency package, and the second target node is the node corresponding to the source code that requires the non-project resource dependency package. Based on the mapping cache table, the KMP algorithm is used to match the first target node with the project resource dependency package to obtain a first matching result, and the second target node is matched with the non-project resource dependency package to obtain a second matching result. Context analysis is performed on the first matching result and the second matching result to obtain a first analysis result and a second analysis result; Based on the first analysis result, the project resource dependency package corresponding to the first target source code is determined, and based on the second analysis result, the non-project resource dependency package corresponding to the second target source code is determined.
6. The method according to claim 5, characterized in that, Based on the mapping cache table, the KMP algorithm is used to perform letter string matching between the first target node and the project resource dependency package to obtain a first matching result, and the second target node is matched with the non-project resource dependency package to obtain a second matching result, including: Based on the number of references to each project resource dependency package and the number of references to each non-project resource dependency package recorded in the mapping cache table, the weights of each project resource dependency package and each non-project resource dependency package are determined. The KMP algorithm is used to match all the project resource dependency packages with the first target node in descending order of weight to obtain the first matching result. The KMP algorithm is used to match all the non-project resource dependency packages with the second target node in descending order of weight to obtain the second matching result.
7. The method according to any one of claims 1 to 6, characterized in that, Based on the target source code and the corresponding target resource dependency package, generate the corresponding resource import statement, including: Based on the target source code, determine the target resource dependency package and the address of the target resource dependency package; Based on the target resource dependency package and its address, a corresponding import statement is generated and inserted into a preset position, which is either the top of the target file's code or a position corresponding to the target source code.
8. An automated resource import statement generation device, characterized in that, include: An acquisition unit is used to acquire configuration information of the project source code and parse the source code in the target file of the project source code according to the configuration information to obtain an abstract syntax tree and a mapping cache table. The configuration information includes project resource dependency packages and non-project resource dependency packages. The project resource dependency packages are resource dependency packages included in the project source code, and the non-project resource dependency packages are resource dependency packages not included in the project source code. The target file is a file containing target source code. The target source code is the source code that needs to import the corresponding target resource dependency package. The target resource dependency package is either the project resource dependency package or the non-project resource dependency package. The determining unit is configured to perform letter string matching between nodes in the abstract syntax tree and the project resource dependency package and the non-project resource dependency package according to the mapping cache table, and determine the target resource dependency package corresponding to the target source code; The generation unit is used to generate corresponding resource import statements based on the target source code and the corresponding target resource dependency package.
9. A computer-readable storage medium, characterized in that, The computer-readable storage medium includes a stored program, wherein, when the program is executed, it controls the device on which the computer-readable storage medium is located to perform the automated generation method of resource import statements according to any one of claims 1 to 7.
10. An electronic device, characterized in that, include: One or more processors, a memory, and one or more programs, wherein the one or more programs are stored in the memory and configured to be executed by the one or more processors, the one or more programs including an automated generation method for executing a resource import statement as described in any one of claims 1 to 7.