Babel · The compiler for writing next generation JavaScript
Babel 作为一个工具,其实只要跟着它官网文档过一遍就知道它怎么用了。
一句话,Babel 能把你写的 JS 变成其他版本的 JS。
这样一来,你就可以写 IE 不支持的 JS 语法了,因为最终会被翻译成 IE 支持的语法。
比如你写 ES6
// src/index.js [1,2,3].map(n => n + 1);
Babel 可以把它翻译成 ES5
// lib/index.js [1,2,3].map(function(n) { return n + 1; });
进入你的项目目录,用这句话安装 Babel:
npm install --save-dev babel-cli babel-preset-latest
然后新建一个文件,命名为 .babelrc,文件内容如下:
{ "presets": ["es2015"] }
然后在 package.json 里面添加一个 script:
"scripts": { "build": "babel src -d lib" },
然后运行命令
npm run build
那么 src/index.js 就会被翻译成 lib/index.js。
怎么能做到我每次改 src/index.js ,lib/index.js 就自动变化呢?
只需要在上面的 script 里面加一个 --watch 选项即可:
这是 package.json 文件 { ... "scripts": { "build": "babel --watch src -d lib" }, ... }
你也用 Babel 来试试 ES2016+ 的语法吧!
饥人谷一直致力于培养有灵魂的编程者,打造专业有爱的国内前端技术圈子。如造梦师一般帮助近千名不甘寂寞的追梦人把编程梦变为现实,他们以饥人谷为起点,足迹遍布包括facebook、阿里巴巴、百度、网易、京东、今日头条、大众美团、饿了么、ofo在内的国内外大小企业。 了解培训课程:加微信 xiedaimala03,官网:https://jirengu.com
本文作者:饥人谷方应杭老师