A smart working method for vscode dynamic component library

Abstract

The present invention discloses an intelligent working method of a vscode dynamic component library, and relates to the field of software technology. It includes data acquisition: obtaining a component library that needs to be added to vscode and feedback basic information, wherein the component library includes multiple components, and the components include component names and component documents, and obtaining and installing plug-ins that need to be used. The present invention automatically reads project configuration information through a plug-in information acquisition method, and can dynamically prompt a configuration information document corresponding to the component name and prompt an optional value of the component attribute of the component name. The configuration file set is located in a cache area, and the plug-in performs real-time matching with the configuration file set in the cache area according to the UI component name in a hover state to realize dynamic switching of the accessed configuration file, so that the prompted information is more accurate, and can help users better use the component library through the plug-in, without the need to build the document and information into the plug-in, without restriction, and conducive to enhancing applicability. Any component library can be accessed after data processing.

Description

Technical Field

[0001] The present invention relates to the field of software technology, and in particular to an intelligent working method of a vscode dynamic component library. Background Art

[0002] vscode is a free, open source, modern, cross-platform code editor developed by Microsoft. It supports multiple programming languages ​​and frameworks, and provides a rich ecosystem of features and plug-ins, making it one of the favorite tools for many developers. The component library is a collection of reusable UI elements and interactive components for building user interfaces. Components in the component library can include buttons, input boxes, tables, dialog boxes, etc. Developers can build complex user interfaces by combining these components. The purpose of the component library is to provide a standardized way to build user interfaces in order to improve development efficiency and maintain consistency.

[0003] In the process of web project development, in order to improve development efficiency, some mature third-party UI component libraries are often introduced. Due to the differences in component functions and complexity, developers need to refer to documents for development during use. In order to improve the work efficiency of developers, plug-ins that can implement component document prompts can be applied. There are many vscode plug-ins on the market that solve the above problems, but there are the following problems: only two or three component libraries in the industry are supported, and other component libraries or component libraries developed by the company cannot be supported. At the same time, documents and information are built into the plug-in, and the plug-in cannot give accurate prompts according to the component library that the current project depends on. Therefore, the present invention is proposed. Summary of the invention

[0004] The purpose of the present invention is to provide an intelligent working method of a vscode dynamic component library to solve the problems raised in the above background technology.

[0005] To achieve the above object, the present invention provides the following technical solutions: an intelligent working method of a vscode dynamic component library, comprising data acquisition: acquiring a component library to be added to vscode and feedback basic information, wherein the component library includes multiple components, and the components include component names and component documents, and acquiring and installing plug-ins to be used;

[0006] Data processing: compare and extract component names with the same name in the component library, rename component names with the same name through the naming method to generate corresponding new component names, replace the corresponding component names with the new component names in the component library, obtain the display set and management set of configuration information and built-in configuration information through the parsing extraction method based on the component library, store the corresponding display set and management set in units of component names in the component library, collect the configuration information of all component information to obtain the configuration information set, preset a data format adapted to the plug-in, output the configuration information set based on the data format to obtain the configuration file set, obtain component properties based on the configuration file set, obtain component properties with a value range through component properties and component documents, the component properties with a value range are the target component properties, and add optional values ​​to the target component properties through auxiliary methods;

[0007] Data sending: Pack the component library to obtain the target data package, embed the configuration file set into the target data package, and send the target data package to the target library;

[0008] Data application: Download and install the target data package to the corresponding dependency folder of the vscode project, view and use the UI component name generated by adding the target data package through the plug-in, initialize the plug-in, listen to the hover event, and when the UI component name is in the hover state, extract the configuration file set of the target data package in the dependency folder and put it into the cache area, match the UI component name with the configuration file set in the cache area through the matching method to obtain the matching result and corresponding information, and if the match is successful, obtain the configuration information corresponding to the component name based on the corresponding information, output the configuration information document, and prompt the configuration information document corresponding to the component name and the optional value of the component attribute under the component name in the hover state. If the match fails, cancel the hover state and terminate the prompt generation;

[0009] Plugin update: Generate update information through the update method and pass it to the user by feeding back basic information. The user decides whether to update the plugin configuration information;

[0010] The way to obtain plug-in information is: customize configuration information and automatically read dependent project configuration information, so as to realize the access of other component libraries and the information access of real-time version.

[0011] Furthermore, the parsing and extraction method includes: setting an identification method, identifying the document format of the component document through the identification method to generate feedback information, presetting a parser adapted to the document format, traversing the component documents of all components in the component library, matching the corresponding parser according to the feedback information to parse the component document and extract configuration information, when the feedback information is fed back in the same component library and there are multiple document formats, selecting multiple parsers corresponding to the feedback information to perform corresponding parsing on the component document and extract configuration information, presetting a display set and a management set, and copying and extracting the configuration information into the display set and the management set, and when there is no parser adapted to the component document format, an error message is generated and output to the feedback basic information.

[0012] Furthermore, the identification method includes: determining the basic document format based on the component document extension name, converting the component document content through a conversion and comparison method based on the basic document format to generate target information, the target information includes no other document formats and other document formats, and forming feedback information through the basic document format and the target information. When other document formats exist in the format information, the feedback information is the basic document format and the other document format, and when other document formats do not exist in the format information, the feedback information is the basic document format.

[0013] Furthermore, the conversion and comparison method includes: setting a document format content converter, adjusting the basic format item of the document format content converter to a basic document format, presetting a target format item, importing the component document content into the document format converter to obtain a target format version of the component document content, comparing the target format version of the component document content with the component document content to obtain a comparison result, the comparison result includes no identical parts and identical parts, when there are identical parts, extracting the document content of the identical parts, importing the document content of the identical parts into the document format content converter to adjust different basic format items for format conversion, comparing the document content of the identical parts before and after the conversion, when the document content of the identical parts changes before and after the conversion, the basic format item adjusted this time is other document formats, when the document content of the identical parts still does not change after adjusting multiple basic format items, generating an error message, and outputting the document content of the identical parts to feedback basic information.

[0014] Furthermore, the naming method includes: adding corresponding suffixes to component names with the same name to generate new component names based on their association with adjacent component names without destroying the corresponding component names, and the association includes the inclusion relationship, causal relationship and hierarchical relationship between the component name and the adjacent component name.

[0015] Furthermore, the matching method includes: obtaining a matching result by comparing the UI component name in the hover state with the component name in the configuration file set in the cache area, and when the match is successful, extracting the configuration information corresponding to the component name in the configuration file set to obtain the corresponding information.

[0016] Furthermore, the update method includes: when the plug-in is started, the latest version of the remote package is obtained by searching the plug-in based on the vscode plug-in market, and the current plug-in version is compared to see whether it is consistent with the latest version of the remote package. If the versions are inconsistent, update information is generated; if the versions are consistent, no update information is generated, and the update information is update or not update. When the user chooses to update, the remote package file is automatically downloaded, decompressed and installed, and the plug-in configuration is updated after the plug-in is restarted. When the user chooses not to update, no update is performed.

[0017] Furthermore, the auxiliary method includes: selecting a document comment or markup language that matches the target component attribute, defining optional values ​​for the target component attribute based on the corresponding value range in the document comment or markup language to obtain an added attribute set, replacing the original component attribute with the added attribute set, and completing the addition of optional values ​​for the target component attribute.

[0018] Compared with the prior art, the present invention has the following beneficial effects:

[0019] The intelligent working method of the vscode dynamic component library automatically reads the project configuration information through the plug-in information acquisition method, and can dynamically prompt the configuration information document corresponding to the component name and prompt the optional value of the component attribute of the component name. The configuration file set is located in the cache area. The plug-in matches the configuration file set in the cache area in real time according to the UI component name in the hover state to realize dynamic switching of the accessed configuration file, making the prompted information more accurate, which can help users better use the component library through the plug-in. There is no need to build the documents and information into the plug-in, which is unrestricted and conducive to enhancing applicability. Any component library can be accessed after data processing.

[0020] At the same time, by obtaining plug-in information in the form of customized configuration information, users can decide whether to update the plug-in configuration information based on actual usage and environment. By embedding the configuration file set in the target data packet and sending it to the target library, other developers can understand the relevant configuration information of each component by viewing the configuration information in the configuration file set when using this component library, thereby making it more convenient to use and customize components. By setting the naming method, component names with the same name can be distinguished, which is beneficial to the subsequent plug-in information prompts and user use. BRIEF DESCRIPTION OF THE DRAWINGS

[0021] Figure 1 A schematic diagram of a structure for obtaining component configuration information of the present invention;

[0022] Figure 2 It is a schematic diagram of the plug-in workflow structure of the present invention;

[0023] Figure 3 This is a schematic diagram of a structure for obtaining specific configuration information of the present invention. DETAILED DESCRIPTION

[0024] The following will be combined with the drawings in the embodiments of the present invention to clearly and completely describe the technical solutions in the embodiments of the present invention. Obviously, the described embodiments are only part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of the present invention.

[0025] In vscode, component libraries are usually used to help developers write code, manage projects and improve development efficiency more efficiently. A component library is a set of packaged components or tools that can be used to quickly build interfaces, process data, implement functions, etc. The present invention uses a plug-in to dynamically switch the accessed configuration file by matching the configuration file set in the cache area in real time according to the UI component name in the hover state, so that the prompted information is more accurate, which can help users better use the component library through the plug-in.

[0026] like Figure 1-Figure 3 As shown, the present invention provides a technical solution: an intelligent working method of a vscode dynamic component library, including data acquisition: acquiring a component library to be added to vscode and feedback basic information, the component library includes multiple components, the components include component names and component documents, and acquiring and installing plug-ins to be used;

[0027] Data processing: compare and extract component names with the same name in the component library, rename component names with the same name through the naming method to generate corresponding new component names, replace the corresponding component names with the new component names in the component library, obtain the display set and management set of configuration information and built-in configuration information through the parsing extraction method based on the component library, store the corresponding display set and management set in units of component names in the component library, collect the configuration information of all component information to obtain the configuration information set, preset a data format adapted to the plug-in, output the configuration information set based on the data format to obtain the configuration file set, obtain component properties based on the configuration file set, obtain component properties with a value range through component properties and component documents, the component properties with a value range are the target component properties, and add optional values ​​to the target component properties through auxiliary methods;

[0028] Data sending: Pack the component library to obtain the target data package, embed the configuration file set into the target data package, and send the target data package to the target library;

[0029] It should be noted that the component library is obtained and added based on the actual needs of users. It can be an industry component library, a company-developed component library or other component library. The basic feedback information includes but is not limited to the user's phone number and IP address. The plug-in is obtained and installed based on the actual needs of users. The names of components with the same names are compared. The comparison method can be achieved through manual comparison or using Beyond Compare, Wi nMerge and other tools are used to rename components with the same name through a naming method to avoid naming conflicts and confusions during subsequent use, making the use and management of components difficult. For example, component library A and component library B both have button components, and the plug-in will only display the document of one of them. If there is no component name with the same name, no subsequent naming processing will be performed. The components in the component library are processed through a parsing and extraction method to obtain configuration information, which is stored according to the component name. The data format is formulated according to the actual situation and can be a data format that the plug-in can recognize. By extracting the configuration information into the management center, the document content of the component can be viewed and managed more conveniently. By extracting the configuration information into the management center, it is convenient to prompt the configuration information through the plug-in in the future, which is conducive to helping developers better understand the function and usage of the component. After storage, the configuration information is integrated together. The configuration information includes but is not limited to: component name, component Using specifications, component document links, component properties, component events and component slots, you can parse the component library that needs to be added to vscode and obtain the configuration information of the component library by parsing the settings of the extraction method. At the same time, this information can be directly recognized by the plug-in based on the same data format. The target library includes but is not limited to the official website of npm and the company's own website. The target data packet is a data packet containing the component library and the configuration file set that is adapted to the receiving format of the target library. For example, when it is sent to the official website of npm, it is in the form of an npm package. Subsequently, through npm installation, the npm package is downloaded and added to the dependency folder of the corresponding project in vscode. By embedding the configuration file set in the target data packet and sending it to the target library, other developers can understand the relevant configuration information of each component by viewing the configuration information in the configuration file set when using this component library, so that it is more convenient to use and customize the components.

[0030] Data application: Download and install the target data package to the corresponding dependency folder of the vscode project, view and use the UI component name generated by adding the target data package through the plug-in, initialize the plug-in, listen to the hover event, and when the UI component name is in the hover state, extract the configuration file set of the target data package in the dependency folder and put it into the cache area, match the UI component name with the configuration file set in the cache area through the matching method to obtain the matching result and corresponding information, and if the match is successful, obtain the configuration information corresponding to the component name based on the corresponding information, output the configuration information document, and prompt the configuration information document corresponding to the component name and the optional value of the component attribute under the component name in the hover state. If the match fails, cancel the hover state and terminate the prompt generation;

[0031] Plugin update: Generate update information through the update method and pass it to the user by feeding back basic information. The user decides whether to update the plugin configuration information;

[0032] The way to obtain plug-in information is: customize configuration information and automatically read dependent project configuration information, so as to realize the access of other component libraries and the information access of real-time version.

[0033] It should be noted that: multiple component libraries may need to be used in the vscode project. The plug-in information is obtained by customizing the configuration information, so that users can decide whether to update the plug-in configuration information according to the actual usage and environment. The plug-in information is obtained by automatically reading the project configuration information, which can dynamically prompt the configuration information document corresponding to the component name and prompt the optional value of the component attribute of the component name. The configuration file set is located in the cache area. The plug-in matches the configuration file set in the cache area in real time according to the UI component name in the hover state to realize dynamic switching of the accessed configuration file, making the prompted information more accurate, which can help users better use the component library through the plug-in. There is no need to build the documents and information into the plug-in, which is unrestricted and conducive to enhancing applicability. Any component library can be accessed after data processing.

[0034] like Figure 1 As shown, the parsing and extraction method includes: setting an identification method, identifying the document format of the component document through the identification method to generate feedback information, presetting a parser adapted to the document format, traversing the component documents of all components in the component library, matching the corresponding parser according to the feedback information to parse the component document and extract the configuration information, when the feedback information is fed back in the same component library and there are multiple document formats, selecting multiple parsers corresponding to the feedback information to parse the component document accordingly and extract the configuration information, presetting a display set and a management set, and copying and extracting the configuration information into the display set and the management set, and when there is no parser adapted to the component document format, an error message is generated and output to the feedback basic information.

[0035] It should be noted that parsers include but are not limited to Markdown parsers, JSON parsers, HTML parsers, and XML parsers. According to the feedback information indicating the document format, the corresponding parser is selected to parse the component document. For example, when the feedback information indicates that the document format is Markdown, the Markdown parser is used to parse the component document. When the feedback information indicates that there are multiple document formats, the corresponding parser is used to parse the corresponding document.

[0036] like Figure 1 As shown, the identification method includes: determining the basic document format based on the component document extension name, converting the component document content through a conversion and comparison method based on the basic document format to generate target information, the target information includes no other document formats and other document formats, and forming feedback information through the basic document format and the target information. When other document formats exist in the format information, the feedback information is the basic document format and the other document format, and when other document formats do not exist in the format information, the feedback information is the basic document format.

[0037] It should be noted that: the basic document format is determined according to the extension of the component document, such as .pdf, .doc, etc. after the file name. The basic document format can also be determined through the file header information. Some document formats may contain specific header information or metadata to indicate the format type of the document. The advantage of determining the basic document format through the component document extension is that it is simple and fast, and the format information can be obtained without reading the file content. The advantage of determining the basic document format through the component document file header information is that it provides detailed format information and can accurately determine the format type of the document. However, it has limitations. Some file headers may not contain data for just the document format.

[0038] like Figure 1 As shown, the conversion and comparison method includes: setting a document format content converter, adjusting the basic format item of the document format content converter to the basic document format, presetting the target format item, importing the component document content into the document format converter to obtain the component document content of the target format item, comparing the target format version component document content with the component document content to obtain a comparison result, the comparison result includes no identical parts and identical parts, when there are identical parts, extracting the identical part document content, importing the identical part document content into the document format content converter to adjust different basic format items for format conversion, comparing the identical part document content before and after the conversion, when the identical part document content changes before and after the conversion, the adjusted basic format item is other document formats, when the identical part document content still does not change after adjusting multiple basic format items, generating an error message, and outputting the identical part document content to feedback basic information.

[0039] It should be noted that: the document format content converter has a basic format item and a target format item. According to the import of a piece of text, the basic format item is adjusted to a known text format, and the target format item is adjusted to the document format that needs to be converted. After the conversion, the text content associated with the basic format item will be converted into the text content corresponding to the target format item. When there is a text format that does not belong to a known text format in the text content, it will still appear in the original text form after conversion. The document format content converter is a prior art and will not be described in detail here. By importing the component document content and adjusting the basic format item as the basic document format, adjusting any target format item, the component document content is converted. After the conversion, the transformation of the document content before and after is compared, and the part that has not changed is extracted, and then the above operation is performed until the document format of the basic format item when the change occurs is the document format of the part that has not changed. When the document format of the basic format item has been adjusted and tried, there is still no change, an error message is generated and fed back to the user, and the user judges the document format of this part.

[0040] The naming method includes: adding suffixes to components with the same name to generate new component names based on their associations with adjacent component names without destroying the corresponding component names. The associations include the inclusion relationship, causal relationship, and hierarchical relationship between the component name and the adjacent component names.

[0041] It should be noted that: when naming without destroying the corresponding component name, the suffix of the generated information is added according to the format of the corresponding component name. This process can be done manually by the user or automatically by other intelligent models. The suffix is ​​added by the association with the adjacent component name, which can better distinguish the component name. The association can also include the functional description of the component name, etc. By setting the naming method, component names with the same name can be distinguished, which is beneficial to the information prompts of subsequent plug-ins and the use of users.

[0042] The matching method includes: obtaining a matching result by comparing the UI component name in the hover state with the component name in the configuration file set in the cache area, and when the match is successful, extracting the configuration information corresponding to the component name in the configuration file set to obtain the corresponding information.

[0043] It should be noted that the comparison process is to traverse the component names in the configuration file set and look for a component name that is consistent with the UI component name. If found, the match is successful, and the configuration information of the component name is extracted to obtain the corresponding information. If there is no component name that is consistent, the match fails.

[0044] The update method includes: when the plug-in is started, the latest version of the remote package is obtained by searching the plug-in based on the plug-in market in vscode, and the current plug-in version is compared to see if it is consistent with the latest version of the remote package. If the versions are inconsistent, update information is generated, and if the versions are consistent, no update information is generated. The update information is update and no update. When the user chooses to update, the remote package file is automatically downloaded, decompressed and installed, and the plug-in configuration is updated after the plug-in is restarted. When the user chooses not to update, no update is performed.

[0045] It should be noted that the essence of a plug-in is an executable logic package file. The plug-in retrieval process is as follows: when the plug-in is started, the vscode plug-in market is automatically used in the background to search for the currently started plug-in. By setting the update method, you can self-check whether the plug-in is the latest version. If it is not the latest version, the information is generated to the user, and the user decides whether to update according to the actual usage environment and needs. Providing an update path helps avoid outdated plug-in versions that cause incorrect display of optional values ​​of configuration information documents and component properties.

[0046] The auxiliary method includes: selecting a document comment or markup language that matches the target component attribute, defining optional values ​​for the target component attribute based on the corresponding value range in the document comment or markup language to obtain an added attribute set, replacing the original component attribute with the added attribute set, and completing the addition of optional values ​​for the target component attribute.

[0047] It should be noted that: selecting document comments or markup languages ​​that match the target attributes can avoid unnecessary format conflicts or errors. Generally, component attributes with value ranges use the middle value in the value range as the optional value of the component attribute by default for greater balance. However, there is only one optional value, which cannot be provided to users in a more accurate and detailed manner. The number of optional values ​​is determined based on actual usage. By setting the optional value of the attribute, users can be provided with more accurate and detailed attribute selection guidance, thereby improving the efficiency and accuracy of component use.

[0048] Example: Figure 3As shown in the figure, when the component library document to be added to vscode is a markdown document, the mdast parser is used to parse the markdown document one by one, and the props / slots / events in the component document are extracted to componentDoc and componentProfit, and componentDoc and componentProfit are stored in units of component names. The configuration information of all components is collected and uniformly output as the ui-profit.json configuration file. When the npm package is released, the ui-profit.json configuration file is built into the npm package, and the npm package is installed into the project dependency folder through npm. The plug-in is initialized, the dependency folder is monitored, and the UI component library ui-profit.json configuration file is retrieved from the dependency folder and placed in the cache area. During the development and use of vscode, the component name is matched with the component library configuration file in the cache area by hovering the component name. When the match is successful, the corresponding configuration information is extracted, the document information is output, and the document information or attribute prompts are displayed in the hover component name state. If the match fails, the hover state is canceled and the prompt generation is terminated. The markdown document in the above is the document format of the component library document. The parser in the parsing and extraction method is the mdast parser, and ".json" is a data format that can be recognized by the plug-in. ComponentDoc and componentProfit are management sets and display sets. The combined use of componentDoc and componentProfit can manage and optimize components more comprehensively to ensure that the document integrity and performance of the components are in the best state. This can improve development efficiency, reduce the possibility of bugs, and enhance the user experience of the application.

[0049] Although embodiments of the present invention have been shown and described, it will be appreciated by those skilled in the art that various changes, modifications, substitutions and variations may be made to the embodiments without departing from the principles and spirit of the present invention, and that the scope of the present invention is limited by the attached embodiments and their equivalents.

Claims

1. An intelligent working method for a vscode dynamic component library, characterized in that: include: Data acquisition: obtain the component library that needs to be added to vscode and feedback basic information. The component library includes multiple components, and the components include component names and component documents. Obtain and install the required plug-ins; Data processing: compare and extract component names with the same name in the component library, rename component names with the same name through the naming method to generate corresponding new component names, replace the corresponding component names with the new component names in the component library, obtain the display set and management set of configuration information and built-in configuration information through the parsing extraction method based on the component library, store the corresponding display set and management set in units of component names in the component library, collect the configuration information of all component information to obtain the configuration information set, preset a data format adapted to the plug-in, output the configuration information set based on the data format to obtain the configuration file set, obtain component properties based on the configuration file set, obtain component properties with a value range through component properties and component documents, the component properties with a value range are the target component properties, and add optional values ​​to the target component properties through auxiliary methods; Data sending: Packaging component library obtains target data package, embeds configuration file set into target data package, and sends target data package to target library; Data application: Download and install the target data package to the corresponding dependency folder of the vscode project, view and use the UI component name generated by adding the target data package through the plug-in, initialize the plug-in, listen to the hover event, and when the UI component name is in the hover state, extract the configuration file set of the target data package in the dependency folder and put it into the cache area, match the UI component name with the configuration file set in the cache area through the matching method to obtain the matching result and corresponding information, and if the match is successful, obtain the configuration information corresponding to the component name based on the corresponding information, output the configuration information document, and prompt the configuration information document corresponding to the component name and the optional value of the component attribute under the component name in the hover state. If the match fails, cancel the hover state and terminate the prompt generation; Plugin update: Generate update information through the update method and pass it to the user by feeding back basic information. The user decides whether to update the plugin configuration information; The way to obtain plugin information is: customize configuration information and automatically read dependent project configuration information, so as to realize the access of other component libraries and the information access of real-time version; The parsing and extraction method comprises: setting an identification method, identifying the document format of the component document by the identification method to generate feedback information, presetting a parser adapted to the document format, traversing the component documents of all components in the component library, matching the corresponding parser according to the feedback information to parse the component document and extract configuration information, when the feedback information is fed back in the same component library and there are multiple document formats, selecting multiple parsers corresponding to the feedback information to parse the component document and extract configuration information, presetting a display set and a management set, and copying and extracting the configuration information into the display set and the management set, and generating an error message and outputting it to the feedback basic information when there is no parser adapted to the component document format; The identification method includes: determining the basic document format based on the component document extension name, converting the component document content through a conversion and comparison method based on the basic document format to generate target information, the target information includes no other document format and other document format, forming feedback information through the basic document format and the target information, when other document formats exist in the format information, the feedback information is the basic document format and the other document format, when other document formats do not exist in the format information, the feedback information is the basic document format.

2. According to claim 1, a smart working method of a vscode dynamic component library is characterized in that: The conversion and comparison method includes: setting a document format content converter, adjusting the basic format item of the document format content converter to a basic document format, presetting a target format item, importing component document content into the document format converter to obtain component document content of the target format item, comparing the target format version component document content with the component document content to obtain a comparison result, wherein the comparison result includes no identical parts and identical parts, when there are identical parts, extracting the document content of the identical parts, importing the document content of the identical parts into the document format content converter to adjust different basic format items for format conversion, comparing the document content of the identical parts before and after the conversion, when the document content of the identical parts changes before and after the conversion, the basic format item adjusted this time is other document formats, and when the document content of the identical parts still does not change after adjusting multiple basic format items, generating an error message, and outputting the document content of the identical parts to feedback basic information.

3. According to claim 1, a smart working method of a vscode dynamic component library is characterized in that: The naming method includes: adding suffixes to components with the same name to generate new component names based on their association with adjacent component names without destroying the corresponding component names, and the association includes the inclusion relationship, causal relationship and hierarchical relationship between the component name and the adjacent component names.

4. According to claim 1, a smart working method of a vscode dynamic component library is characterized in that: The matching method includes: obtaining a matching result by comparing a UI component name in a hover state with a component name in a configuration file set in a cache area, and when the match is successful, extracting configuration information corresponding to the component name in the configuration file set to obtain corresponding information.

5. According to claim 1, a smart working method of a vscode dynamic component library is characterized in that: The update method includes: when the plug-in is started, based on the plug-in market in vscode, the latest version of the remote package is obtained by searching the plug-in, and the current plug-in version is compared to see whether it is consistent with the latest version of the remote package. If the versions are inconsistent, update information is generated, and if the versions are consistent, no update information is generated. The update information includes update and no update. When the user chooses to update, the remote package file is automatically downloaded, decompressed and installed, and the plug-in configuration is updated after the plug-in is restarted. When the user chooses not to update, no update is performed.

6. According to claim 1, a smart working method of a vscode dynamic component library is characterized in that: The auxiliary method includes: selecting a document comment or markup language that matches the target component attribute, defining optional values ​​for the target component attribute based on the corresponding value range in the document comment or markup language to obtain an added attribute set, replacing the original component attribute with the added attribute set, and completing the addition of optional values ​​for the target component attribute.

Images