babel转码器

babel能把es6的代码转为es5，使其能够具有更好的浏览器兼容下。

(1)下载babel

npm install --global babel-cli

参数--global为全局安装，将使babel可以在所有项目中都可以使用。

查看是否下载成功。

babel --version

出现下面提示信息。

参考博客PowerShell：因为在此系统上禁止运行脚本，解决方法 - 简书 (jianshu.com)解决。

(2)转码测试

先新建目录es6demo/es6，编写一个es6的01.js文件，下面代码中箭头函数是典型的es6语法。

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

在项目目录创建.babelrc配置文件。

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

安装es转码器。使用--save-dev参数使其作用范围为在本项目使用即可。

npm install --save-dev babel-preset-es2015

下载成功后项目的node_modules目录如下图。

使用命令将es6下的01.js转码为vs5，保存在dist下。

babel es6/01.js -o dist/01.js

生成的es5文件如下.

"use strict";

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

也可以根据文件夹进行转码。

babel es6 -d dist