阅读基础:可以在node环境下使用npm/yarnBabel将ES6代码转成ES5代码,使其可以在不支持ES6的环境下运行。下面是一个例子://转码前a=>a+1;//转码后(function(a){returna+1;});//上面的代码使用了箭头函数,Babel将其转为a正常功能。Babel虽然支持浏览器环境,但是在网页上实时将ES6代码转成ES5代码会影响网页的性能,所以我们需要在生产环境中提前使用构建工具对ES6代码进行转码。配置babelBabel只能转换语法(比如箭头函数),不支持新的全局变量,比如:Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等。如果你想让这些方法起作用,您必须使用babel-polyfill为当前环境提供方法。babel、babel-polyfill安装:$yarnaddbabel-preset-env--dev$yarnaddbabel-polyfill--dev安装完成后,我们可以通过.babelrc文件或package.json文件配置babel;配置文件可以根据具体需要配置:英文文件和中文文件。方法一:新建一个.babelrc文件,添加如下字段:{"presets":[["env",{"useBuiltIns":true}]]}方法二:在package.json文件中添加字段:{//。.."babel":{"presets":[["env",{"useBuiltIns":true}]]}}babel-cli命令行转码babel提供了babel-cli工具,可用于命令行转码,tools安装:$yarnaddbabel-cli--devbabel-cli基本用法:#输出转码结果$babelindex.js#单个文件转码#--out-file或-o参数指定输出文件$babelindex.js--out-filecompiled.js$babelindex.js-ocompiled.js#整个目录转码#--out-dir或-d参数指定输出目录$babelsrc--out-dirbuild$babelsrc-dbuild#-s参数生成源映射文件$babelsrc-dbuild-s我们可以在package.json文件中添加脚本:{//..."scripts":{"build":"babelsrc-dbuild"},}转码时,执行如下命令。$yarnrunbuildbabel-nodebabel-cli工具自带babel-node命令,提供支持ES6的REPL环境,可以直接运行ES6代码。执行babel-node进入REPL环境:$babel-node>(x=>x*2)(1)2babel-node命令可以直接运行ES6脚本。将以上代码放入脚本文件es6.js中,直接运行即可。$babel-nodees6.js2我们可以重写package.json:{//..."scripts":{"script-name":"babel-nodetest.js"}}使用babel-node代替node,测试.js不需要做任何转码。
