Fetch the repository succeeded.
由于一些浏览器对ES6新特性的支持度不高,或者一些浏览器低版本的不兼容,想再浏览器上直接使用ES6的新特性就得借助工具来实现
Babel是一个广泛使用的转码器,babel可以将ES6代码完美地转换为ES5代码,所以我们不用等到浏览器的支持就可以在项目中使用ES6的特性。
1,新建工程文件夹这里起名叫做es6,然后在里面创建两个文件夹分别为src 、dist
2,在src目录下新建一个index.js文件,里面输入es6代码:
// index.js
let b = 1;
console.log(b);
const name = "dony"
console.log(name)
3,在根目录下执行命令
npm init
生成的package.json的内容如下:
{
"name": "es6",
"version": "1.0.0",
"description": "es6转换es5",
"main": "index.js",
"scripts": {
"build": "babel src --out-dir dist"
},
"keywords": [],
"author": "dony",
"license": ISC
}
4,全局安装babel工具
在终端输入如下命令:
npm install -g babel-cli
虽然已经安装了babel-cli,只是这样还不能成功进行转换,我们还需要安装转换包才能成功转换。
npm install --save-dev babel-preset-es2015 babel-cli
5,新建.babelrc
在项目根目录新建(.babelrc)文件输入如图所示代码:
//.babelrc
{
"presets": [
"es2015"
],
"plugins": []
}
6,转换
在终端输入命令:
npm run build
得到转化结果如下
'use strict';
var b = 1;
console.log(b);
var name = "dony";
console.log(name);
Sign in to post a comment
Comment ( 0 )