文章的系统环境
以下是文章描述的系统已经安装的情况,没有安装的请搜索一下相关模块的安装文章,这里就略过了。
系统:win7
Webstorm:2017-3
nodejs:v6.11.2
npm:3.10.10
(国内cnpm:3.10.10)
安装步骤
1、创建目录(testes6)并初始化项目:
mkdir testes6
cd testes6
npm init -y
2、安装babel
cnpm install -g babel-cli(非国内的可以直接:npm install -g babel-cli)
3、项目当前目录安装babel-cli
cnpm install --save-dev babel-cli
4、安装babel-preset-es2015
cnpm install --save-dev babel-preset-es2015
5、安装babel-preset-env
cnpm i babel-preset-env --save-dev
6、webstorm配置 Javascript的环境默认ES6.
7、webstorm配置babel监视文件变化
8、创建.babelrc文件,写入配置:
{ "presets": [ "es2015" ], "plugins": []}
9、创建test.js文件
let msg = 'hello world!';
console.log(msg);
10、录入js代码,项目自动生成disk目录
let msg = 'hello world!';
console.log(msg);
11、运行js
有点击test.js,选择运行,系统就能把运行结果打印出来。
至此,环境已经配置完成!
额外的一个配置:
参考下图,需要把nodejs/NPM的code 提示enable才能有相关的代码提示。