如何让es6 写的 文件 import 起来

如何让es6 写的 文件 import 起来

习惯了WebStorm的话..我就假设题主会用Node.js和npm啦～一句话总结：用WebStorm自带的FileWatcher功能+Babel实现自动转换ECMAScript6代码为ES5代码我是这么配置的..就先新建一个EmptyProject，然后在src目录下新建了一个main.js；//这一步不是必须的只是刚上手的话从空项目开始自己配置会少很多干扰Then..进入设置，把JavaScriptlanguageversion改成ECMAScript6；再Then..写一段ES6代码'usestrict';//node直接运行ES6代码时，如使用了ES6的一些关键字，比如let，就需要严格模式，否则会报错//这是没有严格模式时候的错误提示//SyntaxError:Block-scopeddeclarations(let,const,function,class)notyetsupportedoutsidestrictmodefunction*fibs(){//GeneratorFunctionleta=0;letb=1;while(true){yielda;//[a,b]=[b,a+b];b=a+b;a=b-a;}}let[first,second,third,fourth,fifth,sixth]=fibs();console.log(first,second,third,fourth,fifth,sixth);现在IDE会出现一个Filewatcher提示条先别点Addwatcher！我们要先去装babel～首先在根目录新建一个package.json{"name":"test-project","version":"1.0.0"}然后打开IDE的Terminal，安装babel-clinpminstall--save-devbabel-cliGood!现在可以去点Addwatcher啦，点完之后会弹出一个框，其中大部分设置IDE都帮你搞定了下面第三行，Program那一项，填$ProjectFileDir$/node_modules/.bin/babel然后点OK，这个时候你就会发现左边多出来一个main-compiled.js文件啦但是还没搞定！现在只是搞定了自动转换的功能，系统默认把ES6compile成了ES6..（你应该会发现compile出来的东西跟原来的一样..Generator函数并没有被转换成ES5的格式）所以我们需要安装Babel的preset以正确识别ES6代码；和刚才一样，在npm安装babel的ES6的presetnpminstall--save-devbabel-preset-es2015在根目录下新建一个.babelrc文件（就是babel在当前项目的配置文件），写上{"presets":["es2015"]}OK搞定！保存再回去看一下main-compiled.js应该就变成这个样子啦，现在你在main.js里直接写ES6代码，IDE都会自动compile成ES5的代码在这里啦～注意：想直接用Node.js运行ES6代码还是有些问题..因为这段代码用的ES6的解构赋值Node.js还未完全支持，需要在运行的时候加入一些tags（以开启Node.js的相关试验特性），具体可以参考Node.js官网对ES6的说明：ECMAScript2015(ES6)。

refuse to do sth

如以上回答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！

点此我要举报以上问答信息