使用Babel实现ES6转ES5

Babel

www.babeljs.cn/

基础实现

1. 安装

   npm install --save-dev @babel/core @babel/cli @babel/preset-env
   

2. 根目录新建 babel.config.json

   {
       "presets": [
           [
               "@babel/env"
           ]
       ]
   }
   

3. package.json 添加 build 自动化命令

   "scripts": {
       "build": "./node_modules/.bin/babel src/js/index.es6.js --out-file dist/js/index.js"
   },
   

4. 控制台运行

   nmp run build
   

5. 测试

   ES6 index.es6.js

   let a = 1;
   let [b, c] = [1, 2];
   

   ES5 index.js

   "use strict";
   
   var a = 1;
   var b = 1,
       c = 2;
   

导出压缩并不含注释

1. 安装

   npm install --save-dev babel-preset-minify
   

2. package.json 添加 min 自动化命令

   "scripts": {
       "min": "./node_modules/.bin/babel src/js/index.es6.js --presets=@babel/env,minify --no-comments --out-file dist/js/index.min.js"
   },
   

3. 控制台运行

   nmp run min
   

补充系列

这是基于 Webpack 和 Babel 搭建的 ES6 转 ES5 工具，供学习和使用。

gitee.com/alimanman/w…