webstrom ES6开发环境配置

• 摘要
  目前 NodeJs 只支持部分 ES6 的语法，有些 ES6 的语法还不支持， 而 import 语法就是其中之一，web browser 也是一样，只支持部分语法，而要 NodeJs 全部支持 ES6 的语法，可能需要在今后新版本的 NodeJs 才可以，所以要想学习es6，就得使用babel编译。
• 安装babel
npm install –save-dev babel-cli
• 安装 babel 的 ES6 preset
  npm install –save-dev babel-preset-env //\*注意save前面是两个\[-\]

• 手动添加 babel 的配置文件
  项目根目录创建.babelrc文件，内容如下：

  { "presets": \[ //"es2015" --如果是 WebStrom 2017 后面的版本，这里不能再使用 es2015 了，需要使用最新的 env  "env" \] }

• 添加file watcher

  File > Settings > Tools > File Watchers

  在打开的配置界面中，其他配置项可以不做修改，只需要修改Program这一栏，找到你安装的 babel-cli 的安装目录下的安装目录\node_modules\.bin\babel.cmd，安装目录一般在你 Webstrom 的工程目录同级。

  File Type：配置该监听器监听的文件类型，可以在Preferences > Editor > File types中配置
  Scope：配置该监听器的监听范围，可自定义新的范围，也可以使用Preferences > Appearance & Behavior > Scopes中定义的范围
  Program：babel的安装位置
  Arguments：命令执行参数，参见Babel CLI
  Working directory：babel命令执行的位置，默认为文件所在目录

• 参考
  webstrom 配置 es6 的运行环境
  WebStorm ES6 语法支持设置