所需基础
node.js
nmp
开始
1、首先新建一个空项目,减少干扰更快的看到配置效果。
2、在项目中创建一个 man.js 文件 。
进入设置:
「 File ?Settings ?Languages&Frameworks ?JavaScript 」
将 JavaScript language version 改成 ECMAScript 6 。
650) this.width=650;" src="https://s3.51cto.com/oss/201710/26/932af7de1a3df7c9721fc9c446cc045b.png-wh_500x0-wm_3-wmp_4-s_4018765102.png" title="1.png" alt="932af7de1a3df7c9721fc9c446cc045b.png-wh_" />
man.js 中输入 ES6 代码,例如:
var Name = ‘Michael‘;function multiply(x, y) { return x * y; };export { Name, multiply as f1}
3、在根目录新建一个 package.json 文件,『这一步如果没有完成,下面的安装会报错』。
输入内容:
{ "name": "test-es6toes5", "version": "1.0.0"}
4、在Terminal中安装相应的包 。
npm install --save-dev babel-clinpm install --save-dev babel-preset-es2015cnpm i babel-preset-env --save-dev
650) this.width=650;" src="https://s3.51cto.com/oss/201710/26/18911da5c37132e6e7972739ae4edfdf.png-wh_500x0-wm_3-wmp_4-s_2186475672.png" title="2.png" alt="18911da5c37132e6e7972739ae4edfdf.png-wh_" />
5、添加 File Watchers 。
进入设置:
「 File ?Settings ?Tools ?File Watchers 」
点击 「+」 号,选择 「 Bable 」。
修改 「 Program 」 一项为以下内容,「此为 windows 设置,其他操作系统自行选择相应的 babel 运行文件」:
「YourProjectDir」\node_modules\.bin\babel.cmd例如:C:\MyProject\node_modules\.bin\babel.cmd
650) this.width=650;" src="https://s4.51cto.com/oss/201710/26/eb880fcc91c465f7ac906a30e134e7a9.png-wh_500x0-wm_3-wmp_4-s_134602318.png" title="3.png" alt="eb880fcc91c465f7ac906a30e134e7a9.png-wh_" />
6、这样就设置完成了,man.js 更改后会进行自动编译,放在项目根目录 dist 文件夹下。
注意
如果能帮到你,赞我一下呗
End.
本文出自 “范斯特罗夫斯基” 博客,请务必保留此出处http://headlock.blog.51cto.com/2772396/1976432
Pycharm ?WebStorm 配置 babel 实现自动编译 ECMAScript6 (es6) 文件
原文地址:http://headlock.blog.51cto.com/2772396/1976432