babel es6转码的基本用法
来源:互联网 发布:centos 编译安装lnmp 编辑:程序博客网 时间:2024/04/27 11:21
# 转码结果输出到标准输出
$ babel example.js
# 转码结果写入一个文件
# --out-file 或-o 参数指定输出文件
$ babel example.js --out-file compiled.js
# 或者
$ babel example.js -o compiled.js
# 整个目录转码
# --out-dir 或-d 参数指定输出目录
$ babel src --out-dir lib
# 或者
$ babel src -d lib
# -s 参数生成source map文件
$ babel src -d lib -s
babel-node
babel-cli工具自带一个babel-node命令, 提供一个支持ES6的REPL环境。 它支持Node的REPL环境的所有功能, 而且可以直接运行ES6代码。
它不用单独安装, 而是随babel-cli一起安装。 然后, 执行babel-node就进入REPL环境。
$ babel-node> (x => x * 2)(1)2babel-node命令可以直接运行ES6脚本。 将上面的代码放入脚本文件es6.js, 然后直接运行。
$ babel-node es6.js2babel-node也可以安装在项目中。
$ npm install --save-dev babel-cli然后, 改写package.json。
{"scripts": {"script-name": "babel-node script.js"}}上面代码中, 使用babel-node替代node, 这样script.js本身就不用做任何转码处理。
babel-register
babel-register模块改写require命令, 为它加上一个钩子。 此后, 每当使用require加载.js、.jsx、 .es和.es6后缀名的文件, 就会先用Babel进行转码。
$ npm install --save-dev babel-register
使用时, 必须首先加载babel-register。
require("babel-register");require("./index.js");
然后, 就不需要手动对index.js转码了。
需要注意的是, babel-register只会对require命令加载的文件转码, 而不会对当前文件转码。 另外, 由于它是实时转码, 所以只适合在开发环境使用。
babel-core
如果某些代码需要调用Babel的API进行转码, 就要使用babel-core模块。
安装命令如下。
$ npm install babel-core --save
然后, 在项目中就可以调用babel-core。
var babel = require('babel-core');// 字符串转码babel.transform('code();', options);// => { code, map, ast }// 文件转码(异步)babel.transformFile('filename.js', options, function(err, result) {result; // => { code, map, ast }});// 文件转码(同步)babel.transformFileSync('filename.js', options);// => { code, map, ast }// Babel AST转码babel.transformFromAst(ast, code, options);// => { code, map, ast }
配置对象options, 可以参看官方文档http://babeljs.io/docs/usage/options/。
下面是一个例子。
var es6Code = 'let x = n => n + 1';var es5Code = require('babel-core').transform(es6Code, {presets: ['es2015']}).code;// '"use strict";\n\nvar x = function x(n) {\n return n + 1;\n};'
上面代码中, transform方法的第一个参数是一个字符串, 表示需要被转换的ES6代码, 第二个参数是转换的配置对象。
babel-polyfill
Babel默认只转换新的JavaScript句法(syntax) , 而不转换新的API, 比如Iterator、 Generator、 Set、Maps、 Proxy、Reflect、 Symbol、Promise等全
局对象, 以及一些定义在全局对象上的方法(比如Object.assign) 都不会转码。
举例来说, ES6在Array对象上新增了Array.from方法。Babel就不会转码这个方法。 如果想让这个方法运行, 必须使用babel-polyfill, 为当前环境
提供一个垫片。
安装命令如下。
$ npm install --save babel-polyfill
然后, 在脚本头部, 加入如下一行代码。
import 'babel-polyfill';// 或者require('babel-polyfill');
Babel默认不转码的API非常多, 详细清单可以查看babel-plugin-transform-runtime模块的definitions.js文件。
- babel es6转码的基本用法
- babel+gulp实时转码ES6
- Babel es6 转 es5
- babel es6转es5
- es6 转es5 webpack babel
- ES6 -- Iterator 的基本用法
- 如何使用Babel将ES6转码为ES5?
- 如何使用Babel将ES6转码为ES5?
- 如何使用Babel将ES6转码为ES5?
- 如何使用Babel将ES6转码为ES5?
- Babel转码工具使es6\es7向es5转码
- ES6 babel
- es6 Babel
- ECMAScript 6 学习系列课程 (ES6 gulp+babel 语法转化的相关用法)
- ES6语法的reactjs组件babel编译
- ES6之Babel的各种坑总结
- ES6之Babel的各种坑总结
- ES6之Babel的各种坑直接
- MySQL主从复制(Master-Slave)与读写分离(MySQL-Proxy)实践
- Eclipse自动编译NDK/JNI的三种方法
- Array常用方法总结
- No qualifying bean of type...found for dependency:expected at least 1 bean which qualifies... 异常解决方案
- SPI 串行外设接口
- babel es6转码的基本用法
- iOS 的 c++,c,obj-C,swift 混用 (转载)
- 浅谈区块链开发数字货币过程中环境变量问题
- cocos2d-x IOS11 删除文件 removeFile等修改
- webpack安装及基础配置
- @Autowired注解出错的原因
- 环境变量,include搜索路径,lib库搜索路径
- Anroid8.0安装未知来源应用
- hive,hbase命令行无法回格