webstorm配置babel自動轉譯es6的方法

1.npm安裝babel

npm install -g babel-cli

2.npm安裝Babel的preset

npm install --save-dev babel-preset-es2015

3.工程路徑新建.babelrc文件(不要落了前面的“.”),內容如下

{
  "presets": [
    "es2015"
  ]
}

.4 打開Settings->Tools->File Watcher->Babel,

5.

5 雙擊打開Babel,進行配置
重點是Watcher Seetings參數:

  • Arguments:--source-maps --out-file $FileNameWithoutExtension$-compiled.js --presets es2015 $FilePath$

 

.6 這樣就完成了自動轉換js的配置,新建index.js文件測試,如下圖,自動生成index-compiled.js文件,這個文件就是轉譯後的文件:

 

 

發佈了33 篇原創文章 · 獲贊 21 · 訪問量 14萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章