Webpack4.0基础教程二:ES6的babel转码配置

1.安装babel-preset-env包:npm install –save-dev babel-preset-env

2.在根目录下创建.babelrc文件:

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


3.为了检验我们的配置是否成功,我们再安装babel-cli包:npm install --save-dev babel-cli,然后我们在根目录下创建一个babel_test文件用于测试,如下:

--babel_test

----test.js

test.js:

let arr = [1, 2, 3];
console.log([...arr]);


并在package.json文件中添加npm脚本:

"scripts": {
 ...
 "build": "webpack",
 "babel": "babel ./babel_test/test.js -o ./babel_test/res.js"
}


该脚本的作用就是将test.js进行转码,并将转码后的内容存储到res.js文件中。

在终端执行npm run babel则会在相同目录下生成res.js:

"use strict";
 
 
var arr = [1, 2, 3];
console.log([].concat(arr));


该文件已经转码成功,说明我们的配置是正确的。

发布了80 篇原创文章 · 获赞 91 · 访问量 15万+

猜你喜欢

转载自blog.csdn.net/YaoDeBiAn/article/details/84797022