前言

近日，在寫 ejs 文件時(shí)，我發(fā)現(xiàn)用 vscode 沒有啥提示，因此換成 webStrom ，但是用 webStrom 將 es6 編譯成 es5 的時(shí)候出現(xiàn)了一些問題??，經(jīng)過一番搜索， 最后終于成功解決，這里記錄一下??

方法

• 首先建立一個(gè)新的工程，點(diǎn)擊設(shè)置

• 在設(shè)置里面，把JavaScript language version改成ECMAScript 6
  

• 然后在js文件里寫一段ES6代碼

• 現(xiàn)在IDE會(huì)出現(xiàn)一個(gè)File watcher提示條

• 此時(shí)先別點(diǎn)Add watcher！

• 在終端切換到項(xiàng)目的路徑，輸入以下命令

npm init -y //package.json

• 安裝babel-cli

npm install --save-dev babel-cli

• 現(xiàn)在可以去點(diǎn)Add watcher，點(diǎn)完之后會(huì)彈出一個(gè)框

• 下面第三行，Program 那一項(xiàng)，填

$ProjectFileDir$/node_modules/.bin/babel

• 然后點(diǎn)OK，這個(gè)時(shí)候你就會(huì)發(fā)現(xiàn)左邊多出來一個(gè)新文件

• 但是現(xiàn)在還沒搞定！現(xiàn)在只是搞定了自動(dòng)轉(zhuǎn)換的功能，系統(tǒng)默認(rèn)把ES6 編譯成了ES6...

• 打開終端，輸入：

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

• 再次打開設(shè)置，在搜索框輸入file watchers，點(diǎn)擊babel

• 在 Arguments 里面將 env 改為 =es2015,點(diǎn)擊ok
  

• 在根目錄下新建一個(gè).babelrc文件（就是babel在當(dāng)前項(xiàng)目的配置文件），寫上：

{
  "presets": [
    "es2015"
  ]
}

• 完成??