A method and system for reconstructing vue project file paths
By creating a new JS file that maps old paths to new paths in a Vue project and generating a webpack alias object, the compatibility and efficiency issues of file path refactoring in large Vue projects are resolved. This achieves efficient file path redirection and is suitable for multiple operating systems.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- 航信云享科技有限公司
- Filing Date
- 2023-09-22
- Publication Date
- 2026-07-03
AI Technical Summary
Existing technologies struggle to redirect specific folder or file paths during the refactoring of medium to large-scale projects based on the Vue framework, especially in optimizing and adjusting file paths for secondary development projects. Furthermore, traditional methods require manual global modifications and are incompatible with multiple operating systems.
By creating a JS file to map the old and new paths of Vue project files/folders, a webpack alias object is generated, and an alias support object is generated using the path resolution method path.resolve(). The webpack resolve property is then configured to implement the new path redirection of files/folders.
It effectively avoids the problem of accidental or missed modifications in global path changes, improves front-end development efficiency, supports compatibility with multiple operating systems, and does not affect secondary development projects.
Smart Images
Figure CN117331889B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of electronic document management technology, and more specifically, to a method and system for reconstructing file paths in a Vue project. Background Technology
[0002] Refactoring medium to large-scale projects based on the Vue framework presents significant challenges in terms of backward compatibility. Furthermore, refactoring and optimizing projects that can be further developed requires comprehensive consideration of various factors, especially the optimization and adjustment of file paths. Traditional methods require manually modifying the reference paths of the refactored files globally. Moreover, developers cannot access the code of secondary developers, which directly hinders the progress of path optimization work.
[0003] The file path processing method mentioned in the patent "Resource File Path Processing Method, Apparatus, Electronic Device and Storage Medium", application number: CN202110668207.6, can only redirect public paths globally and cannot redirect the path of a specific folder or file. Summary of the Invention
[0004] To address the above problems, this invention proposes a method for refactoring Vue project file paths, including:
[0005] Create a JS file with a mapping between the old and new paths of Vue project files / folders. The JS file is used to output a JSON object, with the key value of the JSON object as the new path of the Vue project files / folders, and the corresponding value value of the JSON object as the old path of the Vue project files / folders.
[0006] Read the complete old path of the target Vue project files / folders, and generate a webpack alias object based on the js file and the complete old path of the target Vue project files / folders;
[0007] Configure the properties of the alias object to reconstruct the new path of the target Vue project file / folder, and redirect the old path of the target Vue project file / folder to the new path.
[0008] Optionally, based on the complete old paths of the js file and the target Vue project files / folders, generate a webpack alias object, including:
[0009] Based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method.
[0010] Optionally, based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method, specifically:
[0011] In the target Vue project file / folder, import the js file fileMap.js as the variable fileMap and import the dependency fs-extra as the variable fs, and define the variable aliasObj as an empty object;
[0012] Get the array of key values of the variable fileMap object, iterate through the key value data, replace the path separators in the key value array with the path separators corresponding to different environments, and take the path after replacing the path separator as the new path, named newPath, and take the path before replacing the path separator as the old path, named oldPath.
[0013] The `fs.statSync()` method is used to determine whether the current path is a folder or a file.
[0014] If it is a file, add it to the variable aliasObj object, as shown in the following command:
[0015] aliasObj[path.resolve(__dirname,oldFilePath_)]=path.resolve(__dirname,newFilePath_);
[0016] If it is a folder, perform recursive processing to generate an alias support object for the webpack resolve property.
[0017] Optionally, configure properties on the alias object to reconstruct the new paths for the target Vue project files / folders, including:
[0018] In the alias property of the resolve property of the configureWebpack property in the target Vue project file / folder, the aliasObj object is expanded into the alias object by expanding the symbols to reconstruct the new path of the target Vue project file / folder.
[0019] Furthermore, this invention also proposes a system for refactoring Vue project file paths, comprising:
[0020] The mapping unit is used to create a JS file with a mapping relationship between the old and new paths of Vue project files / folders. The JS file is used to output a JSON object, with the key value of the JSON object as the new path of the Vue project files / folders, and the value value corresponding to the JSON object as the old path of the Vue project files / folders.
[0021] The intermediate processing unit is used to read the complete old paths of the target Vue project files / folders, and generate a webpack alias object based on the js file and the complete old paths of the target Vue project files / folders;
[0022] The refactoring unit is used to configure the properties of the alias object to refactor the new path of the target Vue project file / folder and redirect the old path of the target Vue project file / folder to the new path.
[0023] Optionally, based on the complete old paths of the js file and the target Vue project files / folders, generate a webpack alias object, including:
[0024] Based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method.
[0025] Optionally, based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method, specifically:
[0026] In the target Vue project file / folder, import the js file fileMap.js as the variable fileMap and import the dependency fs-extra as the variable fs, and define the variable aliasObj as an empty object;
[0027] Get the array of key values of the variable fileMap object, iterate through the key value data, replace the path separators in the key value array with the path separators corresponding to different environments, and take the path after replacing the path separator as the new path, named newPath, and take the path before replacing the path separator as the old path, named oldPath.
[0028] The `fs.statSync()` method is used to determine whether the current path is a folder or a file.
[0029] If it is a file, add it to the variable aliasObj object, as shown in the following command:
[0030] aliasObj[path.resolve(__dirname,oldFilePath_)]=path.resolve(__dirname,newFilePath_);
[0031] If it is a folder, perform recursive processing to generate an alias support object for the webpack resolve property.
[0032] Optionally, configure properties on the alias object to reconstruct the new paths for the target Vue project files / folders, including:
[0033] In the alias property of the resolve property of the configureWebpack property in the target Vue project file / folder, the aliasObj object is expanded into the alias object by expanding the symbols to reconstruct the new path of the target Vue project file / folder.
[0034] In another aspect, the present invention also provides a computing device, comprising: one or more processors;
[0035] A processor is used to execute one or more programs;
[0036] When the one or more programs are executed by the one or more processors, the method described above is implemented.
[0037] In another aspect, the present invention also provides a computer-readable storage medium having a computer program stored thereon, which, when executed, implements the method described above.
[0038] Compared with the prior art, the beneficial effects of the present invention are as follows:
[0039] This invention provides a method for reconstructing Vue project file paths, comprising: creating a JavaScript file with a mapping between the old and new paths of Vue project files / folders; the JavaScript file outputting a JSON object, using the key value of the JSON object as the new path of the Vue project files / folders, and using the corresponding value value of the JSON object as the old path of the Vue project files / folders; reading the complete old path of the target Vue project files / folders; generating a webpack alias object based on the JavaScript file and the complete old path of the target Vue project files / folders; configuring properties on the alias object to reconstruct the new path of the target Vue project files / folders, and redirecting the old path of the target Vue project files / folders to the new path. This invention effectively avoids problems such as accidental or missed changes to global paths caused by modifying file reference paths. It only requires adding or modifying configuration files and does not affect existing secondary development by the client, effectively improving front-end development efficiency. Attached Figure Description
[0040] Figure 1 This is a flowchart of the method of the present invention;
[0041] Figure 2 This is a schematic diagram of the method of the present invention;
[0042] Figure 3 This is a structural diagram of the system of the present invention. Detailed Implementation
[0043] Exemplary embodiments of the invention will now be described with reference to the accompanying drawings. However, the invention may be embodied in many different forms and is not limited to the embodiments described herein. These embodiments are provided to fully and completely disclose the invention and to fully convey its scope to those skilled in the art. The terminology used in the exemplary embodiments illustrated in the drawings is not intended to limit the invention. In the drawings, the same units / elements are referred to by the same reference numerals.
[0044] Unless otherwise stated, the terms used herein (including technical terms) have their common meaning as understood by one of ordinary skill in the art. Furthermore, it is understood that terms defined in commonly used dictionaries should be understood to have a meaning consistent with the context of their relevant field, and not to be interpreted as having an idealized or overly formal meaning.
[0045] Example 1:
[0046] This invention proposes a method for refactoring Vue project file paths, such as... Figure 1 As shown, it includes:
[0047] Step 1: Create a JS file with a mapping between the old and new paths of Vue project files / folders. The JS file is used to output a JSON object, with the key value of the JSON object as the new path of the Vue project files / folders, and the value value of the JSON object as the old path of the Vue project files / folders.
[0048] Step 2: Read the complete old path of the target Vue project files / folders, and generate a webpack alias object based on the js file and the complete old path of the target Vue project files / folders;
[0049] Step 3: Configure the properties of the alias object to reconstruct the new path of the target Vue project file / folder and redirect the old path of the target Vue project file / folder to the new path.
[0050] Specifically, based on the complete old paths of the js file and the target Vue project files / folders, a webpack alias object is generated, including:
[0051] Based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method.
[0052] Specifically, based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method.
[0053] In the target Vue project file / folder, import the js file fileMap.js as the variable fileMap and import the dependency fs-extra as the variable fs, and define the variable aliasObj as an empty object;
[0054] Get the array of key values of the variable fileMap object, iterate through the key value data, replace the path separators in the key value array with the path separators corresponding to different environments, and take the path after replacing the path separator as the new path, named newPath, and take the path before replacing the path separator as the old path, named oldPath.
[0055] The `fs.statSync()` method is used to determine whether the current path is a folder or a file.
[0056] If it is a file, add it to the variable aliasObj object, as shown in the following command:
[0057] aliasObj[path.resolve(__dirname,oldFilePath_)]=path.resolve(__dirname,newFilePath_);
[0058] If it is a folder, perform recursive processing to generate an alias support object for the webpack resolve property.
[0059] Specifically, configuring properties on the alias object to reconstruct the new path for the target Vue project file / folder includes:
[0060] In the alias property of the resolve property of the configureWebpack property in the target Vue project file / folder, the aliasObj object is expanded into the alias object by expanding the symbols to reconstruct the new path of the target Vue project file / folder.
[0061] The implementation principle of the above embodiment 1 of the present invention is as follows: Figure 2 As shown, the implementation principle specifically includes the following:
[0062] The front-end development environment uses the Vue CLI project scaffolding built on Node.js. It provides a runtime dependency `@vue / cli-service`, which is built using webpack. Webpack can be configured through the project's configuration file `vue.config.js`. Webpack's `resolve` property supports configuring aliases, where the alias value is a JSON object. During project build, webpack reads this JSON object and replaces the key-value strings in paths containing the key with the corresponding value strings. Therefore, we considered using the old path as the alias key and the new path as the alias value. However, the key and value do not support directly writing path strings, and folder paths are not supported. Therefore, we encapsulated a method to read file path mappings and generate alias objects that can be recognized by webpack's `resolve` property.
[0063] The specific implementation of this invention is as follows:
[0064] Step 1: Add new and old path mappings.
[0065] Create a JavaScript file named fileMap.js that maps old and new paths. This file outputs a JSON object where the keys are the new paths of the files or folders after modification, and the values are the old paths of the files or folders before modification.
[0066] Step 2: Read the file and generate an alias object.
[0067] This step obtains the complete old and new paths of all moved files by recursively reading the files, and generates an alias-supported object for webpack's resolve property using the path.resolve() method.
[0068] Step two, the specific operations are as follows:
[0069] In the Vue project's configuration file vue.config.js, import fileMap.js from step one as the variable fileMap, import the Vue CLI's built-in dependency fs-extra as the variable fs, import the dependency path as the variable path, and define the variable aliasObj as an empty object {}.
[0070] The `fileMap` object is used to retrieve the array of keys (i.e., the new paths) and iterate through it. The path separator ' / ' is replaced with the path separator corresponding to the specific environment. The path separator for each environment is obtained through the variable `path`, whose value is `path.seq`. The new path after the separator replacement is named `newPath`, and the old path after the separator replacement is named `oldPath`.
[0071] The `fs.statSync()` method can be used to check if the current path is a folder or a file. If it is a file, it adds the following to the `aliasObj` object:
[0072] aliasObj[path.resolve(__dirname,oldFilePath_)]=path.resolve(__dirname,newFilePath_);
[0073] If it's a folder, recursive processing is required. Furthermore, since Vue CLI allows paths to only include the parent directory when encountering `index.vue` and `index.js`, special handling is needed for files whose path names contain `index.vue` and `index.js`; the latter part of `oldFilePath` and `newFilePath` should be replaced with an empty string.
[0074] Step 3: Configure aliases.
[0075] In this step, the aliasObj generated in step two needs to be configured into the alias property of the resolve property of the configureWebpack property in vue.config.js. Generally, the alias property will contain default configurations. At this time, the aliasObj object can be expanded into the alias object by using the expansion symbol.
[0076] The writing method is as follows:
[0077]
[0078] After completing the above three steps, webpack can directly redirect the global old path to the new path during the build process without globally modifying internal files. Secondary development projects will inherit the configuration files within that project, so it will also take effect without globally modifying internal files.
[0079] This invention maps the old and new paths in configuration files or folders within a JS file. A custom Node.js method is added to the Vue project's `vue.config.js` configuration file to process the old and new paths according to specific rules, generating an object that can be received by the `alias` property of the Webpack `resolve` property. During the compilation phase, this efficiently and cost-effectively redirects the old paths of globally referenced files to the new paths. Since secondary development projects inherit the common project's `vue.config.js` configuration file, this method saves time and effort, making it possible to batch adjust and optimize project directories.
[0080] It supports configuring new and old path mappings, which makes the scope of redirected paths more explicit;
[0081] Before using the new and old paths, path separators are processed to ensure compatibility across different operating systems such as Windows, macOS, and Linux.
[0082] When the file name is index.vue or index.js, special handling is required. The latter part of oldFilePath and newFilePath should be replaced with an empty string to adapt to the situation where Vue CLI supports the abbreviation of index.vue or index.js to the parent directory.
[0083] When the key and value of the final generated alias object are paths, the path.resolve() method needs to be used for processing.
[0084] The implementation scheme for refactoring Vue project file paths provided by this invention has the following advantages:
[0085] The implementation scheme for reconstructing the file path of a Vue project provided by this invention makes it possible to reconstruct the directory of medium and large-scale front-end projects developed based on Vue CLI. It can effectively avoid problems such as accidental modification or omission caused by globally modifying the reference path of a certain file. It can be achieved simply by adding or modifying the configuration file, and will not affect the secondary development already carried out by the customer, thus effectively improving the efficiency of front-end development.
[0086] A successful case of this invention is a medium-to-large platform project with a front-end based on the Vue framework. The project adopts a front-end and back-end separation architecture and has been further developed by many customers. When optimizing the front-end part of the project, it is necessary to adjust the directory of related files to achieve module separation management. The files to be adjusted are also referenced by the files in the secondary development. Using this invention, the problem of file reference redirection caused by moving files to other paths is effectively solved.
[0087] Example 2:
[0088] This invention also proposes a system 200 for refactoring Vue project file paths, such as... Figure 3 As shown, it includes:
[0089] Mapping unit 201 is used to create a js file with a mapping relationship between the old and new paths of Vue project files / folders. The js file is used to output a JSON object, with the key value of the JSON object as the new path of the Vue project files / folders, and the value value corresponding to the JSON object as the old path of the Vue project files / folders.
[0090] The intermediate processing unit 202 is used to read the complete old path of the target Vue project file / folder, and generate a webpack alias object based on the js file and the complete old path of the target Vue project file / folder;
[0091] The refactoring unit 203 is used to configure the properties of the alias object to refactor the new path of the target Vue project file / folder and redirect the old path of the target Vue project file / folder to the new path.
[0092] Specifically, based on the complete old paths of the js file and the target Vue project files / folders, a webpack alias object is generated, including:
[0093] Based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method.
[0094] Specifically, based on the complete old paths of the js file and the target Vue project files / folders, an alias support object for the webpack resolve property is generated using the path.resolve() method.
[0095] In the target Vue project file / folder, import the js file fileMap.js as the variable fileMap and import the dependency fs-extra as the variable fs, and define the variable aliasObj as an empty object;
[0096] Get the array of key values of the variable fileMap object, iterate through the key value data, replace the path separators in the key value array with the path separators corresponding to different environments, and take the path after replacing the path separator as the new path, named newPath, and take the path before replacing the path separator as the old path, named oldPath.
[0097] The `fs.statSync()` method is used to determine whether the current path is a folder or a file.
[0098] If it is a file, add it to the variable aliasObj object, as shown in the following command:
[0099] aliasObj[path.resolve(__dirname,oldFilePath_)]=path.resolve(__dirname,newFilePath_);
[0100] If it is a folder, perform recursive processing to generate an alias support object for the webpack resolve property.
[0101] Specifically, configuring properties on the alias object to reconstruct the new path for the target Vue project file / folder includes:
[0102] In the alias property of the resolve property of the configureWebpack property in the target Vue project file / folder, the aliasObj object is expanded into the alias object by expanding the symbols to reconstruct the new path of the target Vue project file / folder.
[0103] This invention can effectively avoid problems such as accidental or missed changes to global paths caused by modifying file reference paths. It can be achieved simply by adding or modifying configuration files, and will not affect the secondary development already carried out by the customer, thus effectively improving the efficiency of front-end development.
[0104] Example 3:
[0105] Based on the same inventive concept, this invention also provides a computer device, which includes a processor and a memory. The memory stores a computer program, which includes program instructions. The processor executes the program instructions stored in the computer storage medium. The processor may be a Central Processing Unit (CPU), or other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. It is the computing and control core of the terminal, suitable for implementing one or more instructions, specifically suitable for loading and executing one or more instructions in the computer storage medium to implement corresponding method flows or corresponding functions, thereby implementing the steps of the methods in the above embodiments.
[0106] Example 4:
[0107] Based on the same inventive concept, this invention also provides a storage medium, specifically a computer-readable storage medium (Memory), which is a memory device in a computer device used to store programs and data. It is understood that the computer-readable storage medium here can include both the built-in storage medium in the computer device and extended storage media supported by the computer device. The computer-readable storage medium provides storage space that stores the terminal's operating system. Furthermore, this storage space also stores one or more instructions suitable for loading and execution by a processor. These instructions can be one or more computer programs (including program code). It should be noted that the computer-readable storage medium here can be high-speed RAM or non-volatile memory, such as at least one disk storage device. The processor can load and execute one or more instructions stored in the computer-readable storage medium to implement the steps of the method in the above embodiments.
[0108] Those skilled in the art will understand that embodiments of the present invention can be provided as methods, systems, or computer program products. Therefore, the present invention can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, the present invention can take the form of a computer program product implemented 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. The solutions in the embodiments of the present invention can be implemented using various computer languages, such as the object-oriented programming language Java and the interpreted scripting language JavaScript.
[0109] This invention is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of the invention. 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 illustrations and / or block diagrams. Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.
[0110] 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.
[0111] 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.
[0112] Although preferred embodiments of the invention have been described, those skilled in the art, upon learning the basic inventive concept, can make other changes and modifications to these embodiments. Therefore, the appended claims are intended to be interpreted as including both the preferred embodiments and all changes and modifications falling within the scope of the invention.
[0113] Obviously, those skilled in the art can make various modifications and variations to this invention without departing from its spirit and scope. Therefore, if these modifications and variations fall within the scope of the claims of this invention and their equivalents, this invention also intends to include these modifications and variations.
Claims
1. A method for refactoring Vue project file paths, characterized in that, The method includes: Create a JS file with a mapping between the old and new paths of Vue project files / folders. The JS file is used to output a JSON object, with the key value of the JSON object as the new path of the Vue project files / folders, and the corresponding value value of the JSON object as the old path of the Vue project files / folders. Read the complete old path of the target Vue project files / folders, and generate a webpack alias object based on the js file and the complete old path of the target Vue project files / folders; Configure the properties of the alias object to reconstruct the new path of the target Vue project file / folder, and redirect the old path of the target Vue project file / folder to the new path; The process of generating a webpack alias object based on the complete old paths of the js file and the target Vue project files / folders includes: Based on the complete old paths of the js file and the target Vue project file / folder, an alias support object for the webpack parsing property resolve is generated using the path.resolve() method; The process of generating an alias support object for the webpack resolve property `resolve` based on the complete old paths of the JS file and the target Vue project file / folder using the `path.resolve()` method is as follows: In the target Vue project file / folder, import the js file fileMap.js as the variable fileMap and import the dependency fs-extra as the variable fs, and define the variable aliasObj as an empty object; Get the array of key values of the variable fileMap object, iterate through the array of key values, replace the path separators in the array of key values with path separators corresponding to different environments, and take the path after the replacement path separator as the new path and name it newPath, and take the path before the replacement path separator as the old path and name it oldPath; The `fs.statSync()` method is used to determine whether the current path is a folder or a file. If it is a file, add it to the variable aliasObj object, as shown in the following command: aliasObj[path.resolve(__dirname,oldFilePath_)]=path.resolve(__dirname,newFilePath_); If it is a folder, perform recursive processing to generate an alias support object for the webpack resolve property.
2. The method according to claim 1, characterized in that, The step of configuring properties on the alias object to reconstruct the new path of the target Vue project file / folder includes: In the alias property of the resolve property of the configureWebpack property in the target Vue project file / folder, the aliasObj object is expanded into the alias object by expanding the symbols to reconstruct the new path of the target Vue project file / folder.
3. A system for refactoring Vue project file paths, characterized in that, The system includes: The mapping unit is used to create a JS file with a mapping relationship between the old and new paths of Vue project files / folders. The JS file is used to output a JSON object, with the key value of the JSON object as the new path of the Vue project files / folders, and the value value corresponding to the JSON object as the old path of the Vue project files / folders. The intermediate processing unit is used to read the complete old paths of the target Vue project files / folders, and generate a webpack alias object based on the js file and the complete old paths of the target Vue project files / folders; The refactoring unit is used to configure the properties of the alias object to refactor the new path of the target Vue project file / folder and redirect the old path of the target Vue project file / folder to the new path; The process of generating a webpack alias object based on the complete old paths of the js file and the target Vue project files / folders includes: Based on the complete old paths of the js file and the target Vue project file / folder, an alias support object for the webpack parsing property resolve is generated using the path.resolve() method; The process of generating an alias support object for the webpack resolve property `resolve` based on the complete old paths of the JS file and the target Vue project file / folder using the `path.resolve()` method is as follows: In the target Vue project file / folder, import the js file fileMap.js as the variable fileMap and import the dependency fs-extra as the variable fs, and define the variable aliasObj as an empty object; Get the array of key values of the variable fileMap object, iterate through the array of key values, replace the path separators in the array of key values with path separators corresponding to different environments, and take the path after the replacement path separator as the new path and name it newPath, and take the path before the replacement path separator as the old path and name it oldPath; The `fs.statSync()` method is used to determine whether the current path is a folder or a file. If it is a file, add it to the variable aliasObj object, as shown in the following command: aliasObj[path.resolve(__dirname,oldFilePath_)]=path.resolve(__dirname,newFilePath_); If it is a folder, perform recursive processing to generate an alias support object for the webpack resolve property.
4. The system according to claim 3, characterized in that, The step of configuring properties on the alias object to reconstruct the new path of the target Vue project file / folder includes: In the alias property of the resolve property of the configureWebpack property in the target Vue project file / folder, the aliasObj object is expanded into the alias object by expanding the symbols to reconstruct the new path of the target Vue project file / folder.
5. A computer device, characterized in that, include: One or more processors; A processor is used to execute one or more programs; When the one or more programs are executed by the one or more processors, the method described in any one of claims 1-2 is implemented.
6. A computer-readable storage medium, characterized in that, It contains a computer program, which, when executed, implements the method as described in any one of claims 1-2.