一.介绍:

  Babel是一个Javascript编译器,可以将ES6语法转换成ES5。

  这意味着,你可以现在就用ES6编写程序,而不用担心现有环境是否支持。下面是一个例子:

  //转码前:

  input.map(item => item + 1);

  //转码后:

  input.map(function(item){

    return item + 1; 

  });

二.使用ES6语法:

  1. 创建项目test:
  2. npm init
  3. cnpm install –save-dev babel-cli: Babel提供babel-cli工具,用于命令行转码。
  4. cnpm install –-save-dev babel-preset-latest:最新的ES6语法都能包含
  5. Babel的配置文件是.babelrc,存放在项目的根目录下。使用Babel的第一步,就是配置这个文件。
  6. 该文件用来设置转码规则和插件,基本格式如下:

    {

    "presets":["latest"]

      //或者

        "presets":["es2015"]

    }

  7.cnpm install babel-core@5:Babel也可以用于浏览器环境。但是,从Babel 6.0开始,不再直接提供浏览器版本,而是要用构建工具构建出来。如果你没有或不想使用构建工具,可以通过安装5.x版本的babel-core模块获取。

  8.然后,将下面的代码插入网页。

  <script src="node_modules/babel-core/browser.js"></script>

  <!—-浏览器功能: browser-pollfill.js 让浏览器支持所需要的功能-->

    <script src="node_modules/babel-core/browser-pollfill.js"></script>   <script type="text/babel">

      //Your ES6 code

      let a = [1,2],

      b = [...a,'3'];

      document.body.innerHTML = b;

      console.log(b);

    </script>

  9. browser-sync start –server:自动打开浏览器显示

  另外:

  1. babel in.js –-out-file out.js: 将es6的in.js文件转换成es5并放到out.js中

最新文章

  1. andriod逆向实验截图
  2. Less 语法特性
  3. August 27th 2016 Week 35th Saturday
  4. .Net 使用文件上传控件FileUpload上传图片
  5. Android AVD创建及设置中各参数详解
  6. css中图片的四种地址引用
  7. Each child in an array or iterator should have a unique &quot;key&quot; prop. Check the render method of `CreditCategoryModal`
  8. Redis学习手册(String数据类型)
  9. XCL-Charts画一个图(CurveChart)
  10. ios开发证书,描述文件,bundle ID的关系
  11. Dom编程(三)
  12. jquery-ajax实现文件上传异常处理web.multipart.MultipartException
  13. mongodb数据库备份迁移 windows -&gt; linux
  14. mybatis中:selectKey返回最近插入记录的id
  15. linux获取网络信息函数
  16. 使用KVM虚拟机遇到的问题(持续更新)
  17. IIS 禁止回收
  18. 使用NSIS制作安装包
  19. 探究JS中对象的深拷贝和浅拷贝
  20. jenkins发送测试报告邮件

热门文章

  1. Rafy 框架 - 使用 SqlTree 查询
  2. MVC采用Jquery实现局部刷新
  3. C# 读取app.config配置文件 节点键值,提示 &quot;配置系统未能初始化&quot; 错误的解决方案
  4. HTTP各状态码解释
  5. 来玩Play框架07 静态文件
  6. 菜鸟快飞之JavaScript对象、原型、继承(三)
  7. 苹果 OS X 系统U盘重装-抹盘重装、系统盘制作
  8. plist文件、NSUserDefault 对文件进行存储的类、json格式解析
  9. [转]ubuntu linux下DNS重启后丢失
  10. 4-3 管理及IO重定向