CN111625230A - System for unifying front-end JavaScript coding specifications - Google Patents
System for unifying front-end JavaScript coding specifications Download PDFInfo
- Publication number
- CN111625230A CN111625230A CN202010425229.5A CN202010425229A CN111625230A CN 111625230 A CN111625230 A CN 111625230A CN 202010425229 A CN202010425229 A CN 202010425229A CN 111625230 A CN111625230 A CN 111625230A
- Authority
- CN
- China
- Prior art keywords
- code
- detection
- ujlint
- module
- integration
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000001514 detection method Methods 0.000 claims abstract description 119
- 230000010354 integration Effects 0.000 claims abstract description 32
- 230000000007 visual effect Effects 0.000 claims abstract description 23
- 238000007619 statistical method Methods 0.000 claims abstract description 19
- 238000009434 installation Methods 0.000 claims abstract description 9
- 238000011161 development Methods 0.000 claims description 18
- 238000004458 analytical method Methods 0.000 claims description 16
- 230000006978 adaptation Effects 0.000 claims description 6
- 230000008859 change Effects 0.000 claims description 6
- 238000010801 machine learning Methods 0.000 claims description 4
- 238000004422 calculation algorithm Methods 0.000 claims description 3
- 238000012937 correction Methods 0.000 claims description 3
- 238000009877 rendering Methods 0.000 claims description 3
- 238000013480 data collection Methods 0.000 claims 1
- 238000000034 method Methods 0.000 description 14
- 238000007405 data analysis Methods 0.000 description 10
- 238000010586 diagram Methods 0.000 description 7
- 230000008569 process Effects 0.000 description 7
- 238000012423 maintenance Methods 0.000 description 5
- 230000001960 triggered effect Effects 0.000 description 5
- 230000008901 benefit Effects 0.000 description 4
- 230000004048 modification Effects 0.000 description 4
- 238000012986 modification Methods 0.000 description 4
- 238000004806 packaging method and process Methods 0.000 description 4
- 230000008676 import Effects 0.000 description 3
- 230000009286 beneficial effect Effects 0.000 description 2
- 238000010276 construction Methods 0.000 description 2
- 230000000694 effects Effects 0.000 description 2
- 230000006870 function Effects 0.000 description 2
- 238000007726 management method Methods 0.000 description 2
- 230000007246 mechanism Effects 0.000 description 2
- 238000005457 optimization Methods 0.000 description 2
- 238000012360 testing method Methods 0.000 description 2
- 230000003044 adaptive effect Effects 0.000 description 1
- 230000005540 biological transmission Effects 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 230000001419 dependent effect Effects 0.000 description 1
- 238000009826 distribution Methods 0.000 description 1
- 230000003203 everyday effect Effects 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000004519 manufacturing process Methods 0.000 description 1
- 230000008520 organization Effects 0.000 description 1
- 230000035515 penetration Effects 0.000 description 1
- 238000002360 preparation method Methods 0.000 description 1
- 230000008439 repair process Effects 0.000 description 1
- 238000005096 rolling process Methods 0.000 description 1
- 238000012800 visualization Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/31—Programming languages or programming paradigms
- G06F8/316—Aspect-oriented programming techniques
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Computing Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Stored Programmes (AREA)
Abstract
The invention relates to a system for unifying front-end JavaScript coding specifications, which comprises: the multi-compatible coding specification module is used for analyzing the source code by the analyzer through UJLint to generate an abstract syntax tree, and then outputting whether the code meets the specification or not through mode matching of each plug-in; the integration and deployment detection module is used for executing code detection at each stage of the software life cycle to block unpredictable code errors and specification omission possibly occurring in each link; the automatic engineering configuration module is used for carrying out the installation and configuration work of the multi-compatible coding specification module and the integration and deployment detection module in an automatic mode; and the visual statistical analysis module is used for acquiring detection results of the UJLint in each life cycle of the software codes, visually displaying the result data, and feeding back the result data to the UJLint in an iterative manner as a positive feedback so as to improve the execution quality of the UJLint.
Description
Technical Field
The invention belongs to the technical field of computer networks, and particularly relates to a system for unifying front-end JavaScript coding specifications.
Background
In recent years, as IT resources and services in enterprises become increasingly rich, front-end applications begin to show a trend of scale and complexity, and more front-end development teams begin to introduce a JavaScript coding specification in order to ensure software quality, reduce development cost and improve service efficiency, so that the writing style and syntax format of front-end codes can be controlled, and the maintainability of projects can be improved. At present, several mature JavaScript coding specification detection tools exist in a front-end community, and the requirements of individual developers or small development teams can be completely met by means of the characteristics of convenience in installation and flexibility in configuration. However, for large and medium-sized enterprises, the number of development teams at the front end or the number of projects at the front end is increased to tens of hundreds, and the existing single scheme is directly used to look like a break, which inevitably causes the following problems:
(1) with the increase of service scenes, the front end is not limited to a PC (personal computer) end Web program any more, and also relates to small programs, desktop applications, mobile end native development, a server end node. js and the like; meanwhile, the frame selection of the technical layer also becomes various, and especially the front-end frames in recent years are different day by day, and the code rules of different frames are also different from the traditional jQuery to the read, Angular, Vue, TypeScript and the like. The existing JavaScript coding specification cannot provide uniform support for the different scenes and frames.
(2) The abundance of services will increase the number of front-end projects, and each project is faced with the requirements of development, deployment, operation, maintenance and upgrade, which directly results in the increase of project management complexity and maintenance cost. Most of the existing coding standard schemes are independently installed and configured, have insufficient reusability, and lack an automatic adaptive compatible mechanism in the project updating iteration process.
(3) When the number of developing teams increases and the organization structure becomes complex, the differences between individual and team coding styles begin to become more and more significant, and in the management aspect of unified coding specification, the risk that the scheme penetration degree is weakened, the execution capacity is reduced, and the execution efficiency is difficult to count and analyze is faced.
Disclosure of Invention
The invention aims to provide a system for unifying front-end JavaScript coding specifications, which is used for solving the problems in the prior art.
The invention relates to a system for unifying front-end JavaScript coding specifications, which comprises: the system comprises a multi-compatible coding specification module, an integration and deployment detection module, an automatic engineering configuration module and a visual statistical analysis module; the multi-compatible coding specification module comprises a JavaScript code detection tool UJLint, the UJLint analyzes a source code by an analyzer to generate an abstract syntax tree, and then whether an output code meets the specification or not is determined by mode matching of each plug-in; the integration and deployment detection module executes code detection at each stage of the software life cycle to block unpredictable code errors and specification omission possibly occurring in each link; the automatic engineering configuration module is used for carrying out the installation and configuration work of the multi-compatible coding specification module and the integration and deployment detection module in an automatic mode; and the visual statistical analysis module is used for acquiring detection results of the UJLint in each life cycle of the software codes, visually displaying the result data, and feeding back the result data to the UJLint in an iterative manner as a positive feedback so as to improve the execution quality of the UJLint.
According to an embodiment of the system for unifying front-end JavaScript coding specifications of the present invention, ujlink refers to different front-end project specifications to generate a set of configuration files adapted to the project, and the configuration files can be directly read by a ujlink tool along with each life cycle of a software code.
According to an embodiment of the system for unifying the front-end JavaScript coding specification of the present invention, the module with multiple compatible coding specifications includes: the basic universal layer comprises basic code style, syntax format, detection rule and target environment configuration information, and can cover the minimum configuration of all items; the framework adaptation layer can support, adjust and adapt to different service scenes and technical frameworks through open source or self-developed rule plug-ins; and the frame adaptation layer and the basic universal layer generate UJLint configuration.
According to an embodiment of the system for unifying the front-end JavaScript coding specifications, after a project is accessed to UJLint in a software development stage, an integration development environment and a mainstream code editor have the capability of detecting code changes, and UJLint is called to perform code error prompt and correction during code editing, a hook script about commit is generated in a git directory of the project during initial introduction of the UJLint, and when a user submits a code, the UJLint calls the hook script to trigger code detection and output a detection result.
According to an embodiment of the system for unifying the front-end JavaScript coding specifications, the integration and deployment detection module is embedded with a code detection service in an existing CI platform based on node. js and UJLint in a software integration stage, code detection based on event triggering is carried out by combining various basic capabilities of the CI platform, after a code arrives at a code warehouse, the code warehouse initiates a detection notice to the CI platform, and the UJLint is utilized to carry out full detection on a project to generate a detection report; and code detection based on time triggering is carried out, a detection period and a timing task are set, the CI platform is informed to initiate code detection at specified time, and a detection report is generated.
According to an embodiment of the system for unifying front-end JavaScript coding specifications of the present invention, in the software deployment phase, a code detection service is embedded in an existing CD platform based on node.
According to an embodiment of the system for unifying the specifications of the front-end JavaScript codes, the visual statistical analysis module comprises a data acquisition layer, a data statistical analysis layer and a visual display module; the data acquisition layer provides an acquisition interface outwards, and after the UJLint executes code detection in each life cycle of the software code, the UJLint sends a detection result to the acquisition interface of the data acquisition layer through an HTTP protocol and stores the detection result to a database; the data statistical analysis layer reads the acquired original data from the database, sorts and analyzes the data according to rules, calculates corresponding results according to user-defined dimensions and indexes, and introduces a machine learning algorithm to carry out predictive analysis on the code quality and the change condition of the code quality; the visual presentation layer comprises a chart rendering engine based on an HTML Canvas, presents the analysis result data of the data statistics analysis layer in a browser in a chart form, and provides a plurality of UI component libraries.
According to an embodiment of the system for unifying the specifications of front-end JavaScript codes of the present invention, ujint runs on a node.
By introducing the concepts of the code full life cycle, the automatic engineering configuration and the visual statistical analysis, the invention makes up the shortages and the defects of the current coding standard scheme under the conditions of multiple scenes, multiple frames, multiple personnel and multiple projects.
Drawings
FIG. 1 is a diagram illustrating the architecture of a system for unifying front-end JavaScript encoding specifications of the present invention;
FIG. 2 is a schematic view of the operation process of UJLint;
FIG. 3 is a block diagram of a modular architecture for multiple compatible coding specifications
FIG. 4 is a flowchart illustrating the operation of the integration and deployment detection module;
FIG. 5 is a flowchart illustrating the operation of the automated engineering configuration module;
FIG. 6 is a visual statistical analysis module architecture diagram;
FIG. 7 is a flowchart of a method for unifying front-end JavaScript encoding specifications.
Detailed Description
In order to make the objects, contents, and advantages of the present invention clearer, the following detailed description of the embodiments of the present invention will be made in conjunction with the accompanying drawings and examples.
Fig. 1 is an architecture diagram of a system for unifying front-end JavaScript coding specifications according to the present invention, and as shown in fig. 1, the architecture of the system of the present invention includes: the system comprises a multi-compatible coding specification module, an integration and deployment detection module, an automatic engineering configuration module and a visual statistical analysis module.
As shown in fig. 1, the multi-compatible coding specification module provides and introduces a code detection tool, ujiint (unifiedjavascript link), which is plug-in, flexible in configuration and easy to expand, by using multiple JavaScript coding specifications of an open source community for reference, so as to adapt to the use requirements of the coding specification under multiple scenes and multiple frames. Fig. 2 is a schematic view of an operation process of ujlink, and as shown in fig. 2, ujlink is a JavaScript code detection tool, and the operation process can be summarized as follows: and analyzing the source code by an analyzer to generate an abstract syntax tree, then matching the patterns of all the plug-ins, and finally outputting a detection result, namely whether the code meets the specification or not. The UJLint has the characteristic of plug-in, different code detection rules can be compiled aiming at different service scenes and different technical frames, a rule base of an enterprise team is formed, and adaptation compatibility is enhanced; meanwhile, the UJLint has flexible and rich configuration capability, can configure parsers, plug-ins, rules, environment variables and the like, also supports template generation, import and export and superposition combination of configuration files, and provides various, rapid and convenient coding schemes for developers.
According to the invention, a set of multi-compatible coding specifications is designed for UJLint, and for different front-end projects, a UJLint tool can refer to the specifications to generate a set of configuration files which are adapted to the projects, and the configuration files can be directly read by the UJLint tool along with each life cycle of a software code without manual intervention, so that the execution efficiency and accuracy of the UJLint tool can be improved. Fig. 3 is a schematic diagram of a module architecture of a multi-compatible coding specification, as shown in fig. 3, wherein 1) a basic common layer contains basic configuration information such as a code style, a syntax format, a detection rule, a target environment, and the like, and is a minimum configuration capable of covering all items; 2) the framework adaptation layer can support, adjust and adapt to different service scenes (Web, applets, desktop applications and the like) and technical frameworks (ECMAScript, TypeScript, Angular, Node. js and the like) through open-source or self-developed rule plug-ins; 3) through the selection and the collocation of the two layers, a unified UJLint configuration which is matched with a specific project is finally generated.
In actual use, a developer only needs to fill required fields in the ujiint configuration file according to the type of the current project. And when the project is changed, maintained or upgraded subsequently, the corresponding configuration field is simply modified, so that the target rule can be accurately acted, and other non-target rules are not influenced.
As shown in fig. 1, the integration and deployment detection module includes: in the modern software development and operation and maintenance process, CI/CD (Continuous Integration/Continuous Deployment) is a necessary means for ensuring software engineering and reliability. The integration and deployment detection module can timely block unpredictable code errors and specification omission which may occur in each link by executing code detection in each stage of the software life cycle.
Fig. 4 is a flowchart illustrating the operation of integrating and deploying the detection module, where, as shown in fig. 4, the integration and deployment detection module can cover three main stages of software development, integration and deployment, and in the software development stage, after a project is accessed to ujlink, because both an IDE (integrated development environment) and a mainstream code editor have the capability of detecting code change, it is possible to call ujlink to prompt and correct a code error during code editing by means of the capability. And therefore, when a user submits a code through a git commit command, the UJLint calls the hook script to automatically trigger code detection and output a detection result. The advantages of deploying the detection module are: 1) ujint runs in a non-intrusive manner, without requiring additional configuration by the user in the project; 2) the method supports code increment detection and full detection, when the number of lines of a code file is large, the efficiency can be effectively improved by carrying out increment detection, and when the full detection is required to be carried out on the project periodically, the code quality trend information of the project can be counted by using the time dimension.
In the software integration stage, based on node.js + ujint, the code detection service can be quickly embedded in the existing CI platform, and in combination with various basic capabilities of the CI platform, the method can support: 1) based on event-triggered code detection, when a developer pushes a code to a code warehouse, the code warehouse initiates a detection notice to a CI platform, and the CI platform utilizes UJLint to perform full detection on a project to generate a detection report; 2) based on time-triggered code detection, an administrator can set a detection period and a timing task, notify the CI platform to initiate code detection at a specified time, and generate a detection report.
In the software deployment stage, similarly, based on node.js + ujlink, code detection service can be quickly embedded in the existing CD platform, after the CI system transmits the software code to the CD platform, before software deployment packaging, ujlink code detection is triggered again, and meanwhile, an automation unit test and an integration test are added to generate a detection report, thereby ensuring that the final deployment package is seamless.
Fig. 5 is a work flow diagram of an automatic engineering configuration module, and as shown in fig. 5, in a multi-compatible coding specification module and an integration and deployment detection module, support for multiple scenes and multiple frames and detection coverage for a main life cycle of a code are respectively realized, but more or less complicated installation and configuration works exist and need to be executed manually, such as installation of ujlink, configuration file writing, installation of plug-in, modification of dependent items, and the like. Therefore, the invention introduces an automatic engineering configuration module to finish the installation and configuration work of the two modules in an automatic mode so as to reduce the cost of project initialization, upgrading and maintenance.
In this embodiment, ujlink is manufactured into an npm (Node package manager) package by performing recursive analysis on a ujlink code folder, combing code reference dependence, and compiling and packaging layer by layer, and is installed into a project by an npm install ujlink command when the project is initialized. During installation, project operation scenes (Web, desktop applications, applets and the like), development frameworks (ES, TS, Vue, read and the like), rule plugins (grammar style types, upgrading modes and the like), detection mechanisms (trigger rules, whether events are based or not, whether time is based or not) during integration and deployment can be specified in a parameter mode, such as npm instruction ujline-target Web-frame v ue-plug-in-graphs-plug-in-update auto-trigger time commands, and the commands are expressed as follows: installing a UJLint tool in a project, simultaneously designating the project as a common Web application, developing through an Vue frame, using an ES grammar style, adopting an automatic upgrading mode, and using a time-triggered rule during integration and deployment. Therefore, a whole set of configuration information can be generated and stored in the project configuration file through a command, the detection scheme of the project code in each life cycle is described, the detection and hook capability during UJLint running can be used for fully automatically executing the project code, and the development efficiency is greatly improved.
Fig. 6 is a structure diagram of a visual statistical analysis module, as shown in fig. 6, when the number of team members and the number of projects increase, in order to promote continuous optimization of a coding specification scheme and enhance promotion and promotion of a unified coding specification, a statistical analysis capability needs to be provided, and an execution process and an execution effect of a current coding specification scheme are recorded, analyzed and presented, which is beneficial for project managers and developers to adjust directions and update decisions in time. According to the invention, a visual statistical analysis module is introduced to collect the detection results of UJLint in each life cycle of the software code, and the result data is visually displayed as a forward feedback and continuously iterated, so that the execution quality of UJLint is improved.
The visual statistical analysis module can rely on the existing visual data analysis platform in the enterprise, and can also be docked with a third-party visual data analysis platform. The module consists of three parts of data acquisition, data statistical analysis and visual display, wherein: 1) the data acquisition layer provides an acquisition interface outwards, the UJLint sends a detection result to the acquisition interface of the data acquisition layer through an HTTP after the code detection is executed in each life cycle of the software code, and the UJLint stores the detection result to a database after receiving the detection result; 2) the data statistical analysis layer reads the acquired original data from the database, then carries out sorting and analysis according to a certain rule, the rule supports calculating corresponding results such as code detection time, times and detection stages and code detection passing rate and trend and the like by using self-defined dimensionality and indexes, and meanwhile, a machine learning algorithm can be introduced to carry out predictive analysis on the code quality and the change condition of the code quality; 3) the visual presentation layer comprises a chart rendering engine based on an HTML Canvas, based on which, the analysis result data of the data statistics analysis layer can be presented in a browser in a chart form, meanwhile, the visual presentation layer provides a plurality of UI component libraries, supports a plurality of chart types such as column charts, pie charts, broken line charts and the like, supports a user to carry out interface interaction in a clicking, dragging and rolling mode by means of a corresponding browser operation interface, and can share the chart in a URL or picture form, and also can export the chart data into files such as pdf, excel and the like in a report form.
Fig. 7 is a flowchart of a method for unifying specifications of front-end JavaScript codes, and as shown in fig. 7, the method for unifying specifications of front-end JavaScript codes includes:
step 1: the ujitint tool was introduced.
Step 2: the CI/CD platform is configured.
And step 3: and configuring a data analysis platform.
And 4, step 4: the ujitint tool is run.
And 5: and (5) counting and analyzing results.
The method for unifying the front-end JavaScript coding specification specifically comprises the following steps:
step 1: the ujitint tool was introduced.
The UJLint tool is written by JavaScript, has the advantages of code analysis, plug-in and flexible configuration, and is originally in a folder, wherein a series of JavaScript files are put in a generalizing way according to different functional modules.
When a JavaScript tool is introduced inside an enterprise, it is a common practice to directly copy a JavaScript folder to a specific front-end project, and then refer the JavaScript folder by embedding a < script > tag in an HTML page. The manual copy reference mode is easy to make mistakes, low in efficiency, not beneficial to updating and upgrading, and easy to leak sensitive code information.
Therefore, the UJLint code folder is constructed and manufactured into an npm code package in a mode of recursive analysis, code reference dependency combing and layer-by-layer compiling and packaging, and then the npm code package is uploaded to an enterprise internal software warehouse. When a project needs to import uj link tools, automatic import can be done through the npm install command. After introduction, a developer can automatically generate package information and script configuration information related to ujlink in a package.json file of a project engineering catalog by executing ujlink commands (matching with related parameters such as a service scene and a technical frame), wherein the script configuration information describes operations which need to be executed in each life cycle of a code under the current service scene and the technical frame, and the operations comprise code increment detection, code full amount detection, rule plug-in configuration, timing tasks and the like. Json always follows the project, so at each stage of software development, uj link can automatically execute corresponding operations by reading the configuration in the package json file. Meanwhile, when the ujiint tool needs to be updated (for example, a new function is introduced, the execution efficiency is improved, a known problem is repaired, and the like), the modified codes are packaged, constructed, and uploaded to an enterprise code warehouse again, and each front-end project can still be updated through an npm install command.
The mode of manufacturing the UJLint into npm packages can enable the introduction process of the UJLint tool to be efficient and rapid to the greatest extent.
Step 2: the CI/CD platform is configured.
Aiming at the integration and deployment links of projects, separate CI and CD platforms need to be built, if an enterprise has a corresponding environment, the CI and CD platforms can be directly butted with a code warehouse, and if the enterprise does not have a related environment, a set of CI/CD platforms can be quickly built by means of open-source products or commercial products. After the construction is completed, relevant configuration needs to be performed, that is, a node.js environment and a ujint tool are introduced, so that the node.js is used as an execution environment of the ujint tool. Thus, each time the CI/CD platform receives an update to the item code, the associated command of the UJLint tool is invoked to automatically detect the code.
And step 3: and configuring a data analysis platform.
For convenient statistical analysis, a separate data analysis platform needs to be established. If the enterprise has a relevant environment, the enterprise can be directly docked with a code warehouse and a CI/CD platform, and if the enterprise does not have the relevant environment, a set of data analysis platform can be quickly established by means of open source products or commercial products. After the construction is finished, relevant configuration is needed, namely, the output targets of the data results in the project development environment, the code warehouse and the CI/CD platform point to the acquisition module of the data analysis platform. During specific operation, manual operation can be reduced in an automatic script mode, and configuration efficiency is improved.
Meanwhile, in order to ensure the efficiency and reliability of data transmission, developers can introduce a Message Queue (MQ) which is deployed as a stand-alone system on a server in the network and maintains network connection with the project development environment, the code warehouse and the CI/CD platform. Thus, a set of 'message publishing-subscribing' working mode which accords with the mainstream of the industry is formed, wherein the project development environment, the code warehouse and the CI/CD platform are responsible for 'publishing' detection result data, and once a result is generated, the result is sent to a message queue which is responsible for caching or storing the data; the data analysis platform is responsible for subscribing to data and automatically pushing the data to the data analysis platform once the data is received by the message queue.
And 4, step 4: running UJLint tool
After the preparation work is completed, the development, integration and deployment work of the project can be formally carried out. At each stage, the ujint tool is automatically run at the right moment.
(1) In the development stage, when a developer edits and saves codes in a local IDE or editor or performs git commit operation, UJLint can automatically intervene according to predefined configuration, monitor whether the codes meet the specification in real time, and can give error prompt and correction suggestions by combining with related plug-ins. The user may also manually check the item code by means of a command line, such as executing a command in the item root directory: UJLint-all-autocoix, at which time the ujiint tool will perform full scan and detection on the project code, and automatically repair the related error code.
(2) In the integration phase, ujint can detect code by means of event triggering and time triggering: when a code warehouse (such as a Gitlab inside an enterprise) receives a git push operation of a certain developer, a UJLink service of a CI platform is called, the UJLink service can automatically detect project codes, and if an error code exists, the error code can be ignored or rolled back according to the preset selection, and meanwhile, the developer is informed in real time; json configuration information may be written with fields for CI timing detection in advance, and detection may be performed at a period of every hour, every day, every week, or the like, which is similar to a timing task, and is advantageous for further increasing the detection range and improving reliability.
(3) In the deployment stage, the ujiint detects the code in an event-triggered manner, which is the last code detection before software delivery, and although a part of detection time is sacrificed, the quality of the software code can be guaranteed to the maximum extent through multiple detections. And after the project codes are integrated by the CI platform, the project codes are sent to the CD deployment platform, the CD platform automatically calls the UJLint service to carry out full detection on the project codes before compiling and packaging, and if error codes exist, the error codes can be ignored or rolled back according to the preset configuration selection, and meanwhile, developers are informed in real time.
And 5: and (5) counting and analyzing results.
In each stage of project development, integration and deployment, ujiint generates a code detection result, such as project basic information, detection time, detection type, detection times, detection stages, error number, code passing rate, and the like. By means of the established data analysis platform, the result data can be collected and analyzed in real time, rules with higher error rate in projects are counted, detection result distribution of different teams and projects is combed, and the quality change trend of the current coding specification is predicted.
Meanwhile, by means of the visualization module and the report exporting function, managers can learn information and make decisions visually and accurately more conveniently, developers can adjust coding habits in time, software development quality awareness is developed, and optimal practice documents or manuals of JavaScript coding specifications in enterprise departments or teams can be generated and output externally as a digital asset and capacity, so that business public praise is improved, and enterprise influence is increased.
The invention has the following advantages:
(1) by means of UJLint, project code detection under different service scenes and different technical frames can be automatically supported by simple commands while basic rules are consistent, developers do not need to invest too much time and energy in many problems of project multi-person cooperation, version dependence, upgrading, updating, modification, maintenance and the like, and configuration complexity is greatly reduced.
(2) Through automatic engineering configuration, the method can cover automatic detection of software codes in three key stages of development, integration and deployment, reduces the code error rate to the minimum to the maximum extent, can perform incremental or full detection as required, and considers the detection speed and the detection range. And meanwhile, the UJLint is connected into the project scaffold in a non-invasive mode, so that the software quality is ensured, and the cost of manual intervention is reduced.
(3) By collecting detection data of each stage of the software code and means such as data multidimensional analysis, machine learning assistance and rich visual presentation, managers and developers can clearly, intuitively and accurately master the execution effect and the change trend of the current coding standard scheme, so that iterative optimization of the scheme and quick discovery of common code problems are facilitated, and continuous promotion of business efficiency and continuous enhancement of quality consciousness of the developers are directly promoted.
The above description is only a preferred embodiment of the present invention, and it should be noted that, for those skilled in the art, several modifications and variations can be made without departing from the technical principle of the present invention, and these modifications and variations should also be regarded as the protection scope of the present invention.
Claims (8)
1. A system for unifying front-end JavaScript encoding specifications, comprising: the system comprises a multi-compatible coding specification module, an integration and deployment detection module, an automatic engineering configuration module and a visual statistical analysis module;
the multi-compatible coding specification module comprises a JavaScript code detection tool UJLint, the UJLint analyzes a source code by an analyzer to generate an abstract syntax tree, and then whether an output code meets the specification or not is determined by mode matching of each plug-in;
the integration and deployment detection module executes code detection at each stage of the software life cycle to block unpredictable code errors and specification omission possibly occurring in each link;
the automatic engineering configuration module is used for carrying out the installation and configuration work of the multi-compatible coding specification module and the integration and deployment detection module in an automatic mode;
and the visual statistical analysis module is used for acquiring detection results of the UJLint in each life cycle of the software codes, visually displaying the result data, and feeding back the result data to the UJLint in an iterative manner as a positive feedback so as to improve the execution quality of the UJLint.
2. The system of claim 1, wherein uj int refers to different front-end project specifications to generate a set of configuration files that are adapted to the project, and the configuration files can be directly read by uj int tools along with the life cycles of the software codes.
3. The system of claim 1, wherein the modules of the multiple compatible coding specification comprise: the basic universal layer comprises basic code style, syntax format, detection rule and target environment configuration information, and can cover the minimum configuration of all items; the framework adaptation layer can support, adjust and adapt to different service scenes and technical frameworks through open source or self-developed rule plug-ins; and the frame adaptation layer and the basic universal layer generate UJLint configuration.
4. The system of claim 1, wherein the integration and deployment detection module calls ujiint to perform code error prompt and correction during code editing after a project is accessed to ujiint in a software development phase by virtue of an integration development environment and a mainstream code editor both having a capability of detecting code changes, the ujiint generates a hook script related to commit during initial introduction of the ujiint in a project, and when a user submits a code, the ujiint calls the hook script to trigger code detection and output a detection result.
5. The system of claim 4, wherein the integration and deployment detection module embeds code detection services in an existing CI platform in a software integration phase based on node. js and UJLint, performs code detection based on event triggering in combination with each basic capability of the CI platform, and after the code arrives at the code warehouse, the code warehouse initiates a detection notification to the CI platform, performs full detection on the project by using UJLint, and generates a detection report; and code detection based on time triggering is carried out, a detection period and a timing task are set, the CI platform is informed to initiate code detection at specified time, and a detection report is generated.
6. The system of claim 4, wherein in the software deployment phase, a code detection service is embedded in an existing CD platform based on node.
7. The system of claim 1, wherein the visual statistics analysis module comprises a data collection layer, a data statistics analysis layer, and a visual presentation module;
the data acquisition layer provides an acquisition interface outwards, and after the UJLint executes code detection in each life cycle of the software code, the UJLint sends a detection result to the acquisition interface of the data acquisition layer through an HTTP protocol and stores the detection result to a database;
the data statistical analysis layer reads the acquired original data from the database, sorts and analyzes the data according to rules, calculates corresponding results according to user-defined dimensions and indexes, and introduces a machine learning algorithm to carry out predictive analysis on the code quality and the change condition of the code quality;
the visual presentation layer comprises a chart rendering engine based on an HTML Canvas, presents the analysis result data of the data statistics analysis layer in a browser in a chart form, and provides a plurality of UI component libraries.
8. The system of unifying front-end JavaScript coding conventions of claim 1, wherein ujlink runs on a node.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010425229.5A CN111625230A (en) | 2020-05-19 | 2020-05-19 | System for unifying front-end JavaScript coding specifications |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010425229.5A CN111625230A (en) | 2020-05-19 | 2020-05-19 | System for unifying front-end JavaScript coding specifications |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111625230A true CN111625230A (en) | 2020-09-04 |
Family
ID=72270059
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010425229.5A Pending CN111625230A (en) | 2020-05-19 | 2020-05-19 | System for unifying front-end JavaScript coding specifications |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111625230A (en) |
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112052008A (en) * | 2020-09-10 | 2020-12-08 | 腾讯科技（深圳）有限公司 | Code checking method, device, computer equipment and computer readable storage medium |
| CN112230889A (en) * | 2020-10-16 | 2021-01-15 | 湖南皖湘科技有限公司 | Method for making software development coding specification |
| CN112288840A (en) * | 2020-10-26 | 2021-01-29 | 北京优锘科技有限公司 | Method for realizing running by combining three-dimensional rendering engine with JavaScript engine |
| CN112286557A (en) * | 2020-11-05 | 2021-01-29 | 苏州帝博信息技术有限公司 | Method and device for updating code content in non-covering mode |
| CN113031940A (en) * | 2021-04-29 | 2021-06-25 | 武汉夜莺科技有限公司 | Front-end framework development method and device and terminal equipment |
| CN113190805A (en) * | 2021-05-31 | 2021-07-30 | 世纪龙信息网络有限责任公司 | Code asset management system |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106095681A (en) * | 2016-06-14 | 2016-11-09 | 深圳市彬讯科技有限公司 | A kind of SVN integrated JSHint code detection method and system thereof |
| CN109344080A (en) * | 2018-10-31 | 2019-02-15 | 江苏电力信息技术有限公司 | It is lasting to deliver and the integrated Software Quality Assurance method of automatic test |
| CN109491924A (en) * | 2018-12-21 | 2019-03-19 | 北京达佳互联信息技术有限公司 | Code detection method, device, terminal and storage medium |
| CN109542769A (en) * | 2018-10-25 | 2019-03-29 | 武汉精立电子技术有限公司 | A kind of automated testing method of continuous integrating |
| CN110704297A (en) * | 2019-08-15 | 2020-01-17 | 平安普惠企业管理有限公司 | Code evaluation method and device, computer equipment and storage medium |
| CN111078568A (en) * | 2019-12-20 | 2020-04-28 | 广州华多网络科技有限公司 | Code specification method and device, computer equipment and storage medium |
-
2020
- 2020-05-19 CN CN202010425229.5A patent/CN111625230A/en active Pending
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106095681A (en) * | 2016-06-14 | 2016-11-09 | 深圳市彬讯科技有限公司 | A kind of SVN integrated JSHint code detection method and system thereof |
| CN109542769A (en) * | 2018-10-25 | 2019-03-29 | 武汉精立电子技术有限公司 | A kind of automated testing method of continuous integrating |
| CN109344080A (en) * | 2018-10-31 | 2019-02-15 | 江苏电力信息技术有限公司 | It is lasting to deliver and the integrated Software Quality Assurance method of automatic test |
| CN109491924A (en) * | 2018-12-21 | 2019-03-19 | 北京达佳互联信息技术有限公司 | Code detection method, device, terminal and storage medium |
| CN110704297A (en) * | 2019-08-15 | 2020-01-17 | 平安普惠企业管理有限公司 | Code evaluation method and device, computer equipment and storage medium |
| CN111078568A (en) * | 2019-12-20 | 2020-04-28 | 广州华多网络科技有限公司 | Code specification method and device, computer equipment and storage medium |
Cited By (9)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112052008A (en) * | 2020-09-10 | 2020-12-08 | 腾讯科技（深圳）有限公司 | Code checking method, device, computer equipment and computer readable storage medium |
| CN112052008B (en) * | 2020-09-10 | 2022-02-18 | 腾讯科技（深圳）有限公司 | Code checking method, device, computer equipment and computer readable storage medium |
| CN112230889A (en) * | 2020-10-16 | 2021-01-15 | 湖南皖湘科技有限公司 | Method for making software development coding specification |
| CN112288840A (en) * | 2020-10-26 | 2021-01-29 | 北京优锘科技有限公司 | Method for realizing running by combining three-dimensional rendering engine with JavaScript engine |
| CN112288840B (en) * | 2020-10-26 | 2021-08-24 | 北京优锘科技有限公司 | Method for realizing running by combining three-dimensional rendering engine with JavaScript engine |
| CN112286557A (en) * | 2020-11-05 | 2021-01-29 | 苏州帝博信息技术有限公司 | Method and device for updating code content in non-covering mode |
| CN112286557B (en) * | 2020-11-05 | 2024-03-22 | 苏州帝博信息技术有限公司 | Method and device for updating code content in non-coverage mode |
| CN113031940A (en) * | 2021-04-29 | 2021-06-25 | 武汉夜莺科技有限公司 | Front-end framework development method and device and terminal equipment |
| CN113190805A (en) * | 2021-05-31 | 2021-07-30 | 世纪龙信息网络有限责任公司 | Code asset management system |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN111625230A (en) | System for unifying front-end JavaScript coding specifications | |
| CN112394922B (en) | Decision configuration method, business decision method and decision engine system | |
| EP2228726B1 (en) | A method and system for task modeling of mobile phone applications | |
| US9772830B2 (en) | System and method for modeling cloud rules for migration to the cloud | |
| US20200387356A1 (en) | System and method for migrating legacy software to a system common architecture | |
| US20050273757A1 (en) | Methods, systems, and computer program products for summarizing operational behavior of a computer program | |
| US20110035726A1 (en) | Identifying source code elements for refactoring | |
| US20030140138A1 (en) | Remotely driven system for multi-product and multi-platform testing | |
| US20120110030A1 (en) | Software database system and process of building and operating the same | |
| CA2406866A1 (en) | System and method for migrating software | |
| WO2006087728A1 (en) | System for creating parallel applications | |
| CN114218052B (en) | Service interaction diagram generation method, device, equipment and storage medium | |
| CN104317580A (en) | Integrated development environment for virtual test application (APP) | |
| Riva et al. | UML-based reverse engineering and model analysis approaches for software architecture maintenance | |
| CN108287720B (en) | Software compiling method, device, equipment and storage medium | |
| Rubasinghe et al. | Towards traceability management in continuous integration with SAT-Analyzer | |
| Rahman et al. | A DSL for importing models in a requirements management system | |
| CN116400950A (en) | DevOps element pipeline system based on version control | |
| Gómez | Supporting integration activities in object-oriented applications | |
| CN111694726A (en) | Python program type derivation method based on type labeling | |
| US11544179B2 (en) | Source traceability-based impact analysis | |
| CN115480940A (en) | Page calling method, device and medium for financial ratio indexes | |
| CN112597011B (en) | Operator test case generation and optimization method based on multiple languages | |
| CN113609015A (en) | Automatic test framework based on Bash Shell | |
| Eramo et al. | Model-driven design-runtime interaction in safety critical system development: an experience report |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |