使用babel 把es6语法转成es5

我们写代码的时候,如果使用的是es6的语法,直接编译,很多浏览器是不
支持,我们必须要转成es5,废话不多说,看代码
1.初始化项目
npm init -y(-y跳过所有输入步骤,直接生成package.json)
2.全局安装babel
npm/cnpm install -g babel-cli
3.本地安装babel 
cnpm/npm install --save-dev babel-preset-es2015 babel-cli
4.在根目录新建一个.babelrc文件,
里面的内容为:{
  "presets":[
    "es2015"
  ],
  "plugins":[]
}
5.开始转换
babel src/index.js -o dist/index.js
6.命令行转换
如果每次都要输入以上命令非常麻烦,我们可以在package.json里面设置一个命令
"scripts": {
    "build": "babel src/index.js -o dist/index.js"
  },
只要执行 :npm run build 就大功告成啦!

如果不够清晰,请看以下截图:
(1)目录结构:


image.png

(2)index.html


image.png

(3)package.json
image.png

(4).babelrc
image.png

(5)src的index


image.png

(6)dist转换后的代码


image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容