Bable的快速入门

Bable的使用

1. 概念

Bable是一个转换器，可以将ES6代码转换成ES5代码，因为浏览器对ES5代码支持性较好

2. 安装

(1) 执行指令npm install --global babel-cli即可安装

(2) 执行指令bable --version查看是否安装成功

3. 使用

(1) 创建两个文件夹及01.js文件，编写ES6格式的代码

let input = [1, 2, 3]
input = input.map(item => item + 1)

(2) 在根目录文件夹下创建.bablerc文件 (不可加前缀)

{
    "presets": ["es2015"],
    "plugins": []
}

(3) 使用指令npm install --save-dev babel-preset-es2015安装es2015转码器

(4) 转码方式一：转码指定文件

i. 使用指令babel 被转码的ES6文件路径 -o 转码后的ES5文件路径

ii. 在上述的dist空文件夹下自动创建001.js文件

"use strict"; 

var input = [1, 2, 3];
input = input.map(function (item) {
  return item + 1;
});

(5) 转码方式二：转码整个目录

i. 使用指令babel 被转码的目录 -d 转码后的目录

ii. 在上述的dist空文件夹下自动创建同名的01.js文件，内容与001.js相同