這座城
從Babel 6.0開始,不再直接提供瀏覽器版本,需要配合webpack等構建工具使用。如果你的項目相當簡單,并不需要使用構建工具,而你又想在Web項目中使用ES6的語法,Babel+Browserify可以滿足你的需求。
第一步:安裝 babelify
模塊
$ cnpm install -save-dev babelify babel-preset-es2015
第二步:修改package.json
在package.json中添加以下配置:
{
"browserify": {
"transform": [["babelify", { "presets": ["es2015"] }]]
}
}```
#####第三步:在命令行執行轉換命令
```$ browserify main.js -o bundle.js```
Browserify編譯的時候,會將腳本所依賴的模塊一起編譯進去。因此,只需要轉換web項目的入口文件。上面命令將ES6腳本main.js,轉為bundle.js,瀏覽器直接加載后者就可以了。
-----
######如果你的項目使用的是 `require` 的方式加載模塊,單獨的Browserify就能滿足你。
#####首先,安裝Browserify
`$ npm install -g browserify`
#####將CommonJS格式的文件轉換為瀏覽器支持的格式:
`$ browserify main.js -o bundle.js`
瀏覽器直接加載 `bundle.js` 就可以了。