如何使用babel将ES6语法的代码进行转换

首先我们新建一个空的文件夹,作为一个空的项目。然后点击文件路径,输入CMD进入DOS。
然后输入命令

npm install --save-dev babel-cli

安装完成后,接着输入下述命令

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

再新建两个文件,分别为.babelre,package.json

//.babelrc
{
 "presets": ["es2015"],
 "plugins": []
}
//package.json
{
    "devDependencies": {
        "babel-cli": "^6.26.0",
        "babel-preset-es2015":"^6.24.1"
    },
    "scripts": {
        "build":"babel es6.js --out-file es5.js"
    }
}

此时文件的目录如下图所示(node_modules文件夹和package-lock.json是前两次命令下载下来的,可以不用管)
1.PNG

接着我们新建一个es6.js文件并在里面编写一段ES6的代码,例如

export let a=6;

接着还是用命令行进入这个项目,如果你之前安装babel-cli,babel-preset-es2015没有关掉命令行就在上述操作完成之后可以键入

npm run build

接着我们在项目中可以看到多了一个es5.js的文件

"use strict";
Object.defineProperty(exports, "__esModule", {
  value: true
});
var a = exports.a = 6;

这样我们就完成了转换,此时项目目录如图所示


2.PNG

(请确保你的电脑之前已经安装了node.js环境!)

你可能感兴趣的:(如何使用babel将ES6语法的代码进行转换)