ES6+ to ES5

Time:2020-3-17

I recently received a big “good news”: some customers of zxbc project want to support ie for insurance industry and other reasons
In 2013, the draft of ES6 was frozen. In June 2015, ES6 was officially adopted as an international standard. All 9102, chrome is OK. Upgrade to the latest version, most ES6 is OK, but the source of all evil IE? As a front-end developer, compatible with all evil ie, all of a sudden, there are thousands of words missing here
Helpless move, roll up the sleeve to open dry. JS uses Babel to make ES6 to Es5.

1、 Node installation

1. Computer right properties system type (my 64 bit operating system)

file

2. Download node
Download address: https://nodejs.org/en/download/
file
Find the 32-bit or 64 bit MSI file corresponding to your system, download and install it.
After installation, enter CMD terminal to execute command after win + R:
  node -v
file
If you see the version number, the installation is successful.

2、 NPM installation

It’s recommended to use Taobao image. I feel faster and execute the command
 npm install -g cnpm –registry=https://registry.npm.taobao.org
After installation, execute
 npm -v
If you see the version number, the installation is successful

3、 Initialize project

1. Establish project directory
SRC: directory address of JS file written in ES6 syntax;
Dist: use Babel to convert to the file directory address of Es5, and reference the JS file in this folder in the project
file
2. The terminal executes the command after entering the project directory
 cnpm init -y
-Y means all defaults, no need to hit enter all the time
file
It’s OK to see the automatically generated package.json

4、 Babel installation

Global installation of Babel cli
Terminal execution command:
 cnpm install -g babel-cli

5、 Install Babel conversion package

Terminal execution command:
 cnpm install –save-dev babel-preset-es2015 babel-cli

6、 Enter the following code in the new (. Babelrc) file in the project root directory:

 { “presets”: [ “es2015” ], “plugins”: [] }
If you right-click to create a new file and then modify the rename prompt: you must type a file name. At this time, you can use the editor to create a new file

7、 Input the terminal conversion command to convert the index.js file written by ES6 into Es5

 babel src/index.js -o dist/index.js
file

8、 Simplify terminal command and modify scripts in package.json file

file

After that, the terminal can execute the command after modifying the JS file
 cnpm run build
This is just a JS single file conversion. The multi file conversion will be supplemented next time
Encourage and urge!