Babel插件 将es6语法转换为es5

为什么需要Babel插件
这是对ES5之后的版本升级,再ES5之后统称为ES6,新加入了许多语法,使得在浏览器上的兼容性变得差强人意,但可以很好的运行在node.js上,但是又不能进行dom和ajax操作,所以在使用es6语法的时候需要先将es6语法转换为es5语法,然后再运行再浏览器上,使之兼容性变得良好.
下载babel插件,转换es6代码

  1. 首先需要node.js环境
    在dos窗口可以通过
    在这里插入图片描述
    查看node版本
    如果没有可以在官网下载安装

  2. 在该目录下新建一个文件夹

  3. 在该文件夹中 >npm init 将该文件夹初始化成一个node.js项目

  4. 在该文件夹中新建一个a.js文件,编写es6代码

  5. 本地安装 在当前目录下 >npm install --save-dev babel-cli
    下载完成之后>babel --version查看版本号
    如果出现说明下载完成

  6. 安装预设
    npm install --save-dev babel-preset-latest
    预设为es6转换为es5

  7. 在该文件夹下新建并配置.babelrc文件
    {
    “presets”:[“latest”]
    }

  8. 将a.js文件转换为ES5之后生成一个b.js文件
    babel a.js --out-file b.js
    将多个js文件转换为ES5语法
    babel src --out-dir dist 将src文件下的js文件转换到dist文件当中
    可以在package.json中可以进行配置 “build”: “babel src --out-dir dist”,
    之后每次在项目的根目录下执行npm run build 就可以进行ES6->ES5的转换

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值