Method for customizing front-end automatic development environment based on webpack

A development environment, automatic refresh technology, applied in the direction of program control design, program control device, program loading/starting, etc.

Pending Publication Date: 2020-07-17
CHUANGSHENG SHILIAN DIGITAL TECH BEIJING CO LTD
View PDF1 Cites 8 Cited by
  • Summary
  • Abstract
  • Description
  • Claims
  • Application Information

AI Technical Summary

Problems solved by technology

[0014] The present invention provides a method for customizing the front-end automation development environment based on webpack. The development mode adopted by most of the current projects is the development of the module method, and solves how to use webpack to realize the modular development method, so as to realize the corresponding front-end automation environment.

Method used

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
View more

Image

Smart Image Click on the blue labels to locate them in the text.
Viewing Examples
Smart Image
  • Method for customizing front-end automatic development environment based on webpack
  • Method for customizing front-end automatic development environment based on webpack
  • Method for customizing front-end automatic development environment based on webpack

Examples

Experimental program
Comparison scheme
Effect test

Embodiment Construction

[0046] The following is an explanation of the operation steps of a certain embodiment of the present invention:

[0047] 1. Basic preparation stage

[0048] 1.1 Create a new folder and name it webpack-cli. webpack-cli is the project name. The project name uses lowercase letters without spaces and cannot contain uppercase letters.

[0049] 1.2 Install Webpack, Webpack can be installed using npm.

[0050] Use the terminal to execute the following instructions in this folder to complete the installation. Due to network reasons, the installation process may take some time.

[0051] / / Global installation

[0052] npm install -g webpack

[0053] / / Install to your project directory

[0054] npm install --save-dev webpack

[0055] Note: The cnpm dependency package of Taobao mirror can be downloaded faster

[0056] Webpack can be installed globally or to your project directory. Just started learning Webpack. For convenience, it is recommended to install both globally and to your...

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to view more

PUM

No PUM Login to view more

Abstract

The invention provides a method for customizing a front-end automatic development environment based on webpack, and the method comprises the following steps: S1, downloading and installing the webpack, configuring the parameters of the webpack, and generating an information file Source Maps; S2, downloading a dependence packet corresponding to the Bable and the CSS, and configuring the Bable and the CSS; S3, analyzing the CSS preprocessor; S4, adding a thermal loading function to realize automatic project refreshing; and S5, after a complete development environment is constructed by using Webpack, configuring a product, and optimizing by optimizing a plug-in. According to the method, a webpack tool is utilized to realize a front-end modular development environment, and optimization processing such as CSS automatic complementation, ES6 code conversion, storage refreshing, self-starting server functions and later caching is realized.

Description

technical field [0001] The invention relates to a processing method for a development environment, in particular to a method for customizing a front-end automation development environment based on webpack. Background technique [0002] Many web pages today can actually be regarded as feature-rich applications, they have complex JavaScript code and a lot of dependencies. In order to simplify the complexity of development, many practical methods have emerged in the front-end community: [0003] A: Modularization allows developers to refine complex programs into small files; [0004] B: Similar to TypeScript, a development language based on JavaScript: it enables developers to implement features that cannot be directly used in the current version of JavaScript, and can be converted into JavaScript files to enable browsers later; [0005] C: It can recognize CSS preprocessors such as scss and less. [0006] These improvements have indeed greatly improved the development effic...

Claims

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to view more

Application Information

Patent Timeline
no application Login to view more
IPC IPC(8): G06F8/30G06F8/38G06F8/61G06F9/445
CPCG06F8/315G06F8/38G06F8/61G06F9/44505G06F9/44526
Inventor 牛强董世永
Owner CHUANGSHENG SHILIAN DIGITAL TECH BEIJING CO LTD
Who we serve
  • R&D Engineer
  • R&D Manager
  • IP Professional
Why Eureka
  • Industry Leading Data Capabilities
  • Powerful AI technology
  • Patent DNA Extraction
Social media
Try Eureka
PatSnap group products

Browse by: Latest US Patents, China's latest patents, Technical Efficacy Thesaurus, Application Domain, Technology Topic.

© 2024 PatSnap. All rights reserved.Legal|Privacy policy|Modern Slavery Act Transparency Statement|Sitemap