babel与ES6环境的搭建

我们知道浏览器环境下直接运行ES6是存在一些兼容性问题的。那么把ES6变成ES5不就行了吗?
那如何将ES6转换成ES5呢?我们来搭建它的转换环境吧~
第一步:初始化项目,建立写注意事项的README.md文件,初始化package.json文件。
1037363-20180815110304866-950855160.png
第二步:创建index.html文件,创建src文件夹放js文件,dist文件夹放编译之后的js文件(这个也是html文件要引入的js文件)。
记得要修改package.json文件。
1037363-20180815111620293-1381828661.png
1037363-20180815111517692-1149706949.png
第三步:安装es2015preset,创建.babelrc文件,添加preset。最后运行代码。
1037363-20180815111828021-455821471.png
1037363-20180815111855584-686006062.png
1037363-20180815111729011-573496355.png
编译之后的文件
1037363-20180815111927842-1826043449.png
很想把完整的demo也给大家看,已经上传到github了:https://github.com/JserJser/reactDemo/tree/master/react-project/es6-course

转载于:https://www.cnblogs.com/smart-girl/p/9480355.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值