babel

Bebal转码就是将es6代码转化为es5代码的包,用于一些不支持es6的场景
第一步自然就是先要安装对应的包了


npm i -g bebal-cli
npm i -s bebal-preset-es2015

这里我们要特别讲一下npm 的这个-s -g -D 有什么区别
-s 就是 --save 就是写入dependencise
-D 就是 --save-dev 就是写入devDependencise
-g 就是 全局安装 不加的话就是本地安装 写入./node_modules
那么dependencise 和 devDependencise有什么区别呢
前者是直接用于生产环境,后者是用于开发环境
就是一些类似打包的工具只需要放到开发环境就可以了,生产的时候并不需要

回到原来的话题,安装好bebal包之后我们需要创建一个 .bebalrc 文件,(注意不要前面加命名,只需要.bebal这个点和后缀就可以,本人亲自踩坑)

在.bebalrc文件里写入

{
    "presets":["es2015"]
}

意思就是将es6(es2015)转化为es5代码的意思
然后在终端输入转化指令就可以了

babel es6.js -o es5.js //(-o 就是 --out-file)
 //如果是整一个文件夹转化的话
babel -d es5Dir  es6Dir  (es6Dir是es6的文件夹,es5Dir是转化后生成的新的es5文件夹)
//如果需要添加source map文件的话在后面加一个-s
//本人再次踩坑,es6 的源文件应该放在后面
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • babel官网 babel 介绍 Babel 是一个通用的多用途 JavaScript 编译器。通过 Babel ...
    锋享前端阅读 5,797评论 0 10
  • 一、ES6 参考 http://es6.ruanyifeng.com/ ECMAScript当前所有提案 Git...
    pifoo阅读 14,044评论 1 13
  • 相信很多新手没有听说过Babel和ES6,如果你是老手的话,那么请自动忽略~ ES6也就是ECMAScript 6...
    penggelies07阅读 5,960评论 0 6
  • babel 6与之前版本的区别: 之前版本只要安装一个babel就可以用了,所以之前的版本包含了一大堆的东西,这也...
    _花阅读 5,454评论 0 2
  • babel 7 的使用的个人理解 最近看了很多关于babel的使用方法,大部分在一些点上都没有说明白,同时给出的代...
    zshawk1982阅读 21,110评论 14 43