可以在es6中写一个大文件吗？

问题：如何在ES6中编写我的gulp文件，这样我就可以使用import来代替require并在function()使用=>语法？

我可以使用io.js或节点的任何版本。

---

gulpfile.js：

 import gulp from "./node_modules/gulp/index.js"; gulp.task('hello-world', =>{ console.log('hello world'); }); 

错误：

 import gulp from "./node_modules/gulp/index.js"; ^^^^^^ SyntaxError: Unexpected reserved word 

---

 gulp.task('hello-world', =>{ ^^ SyntaxError: Unexpected token => 

在node_modules/gulp/bin/gulp.js我把第一行改成了#!/usr/bin/env node --harmony

Answer 1

是的，你可以通过使用巴贝尔 。

确保你有最新版本的gulp-cli。

npm install -g gulp-cli

安装babel作为项目的依赖项。

npm install --save-dev babel

将gulpfile.js重命名为gulpfile.babel.js

你的大文件可能看起来像这样：

 import gulp from 'gulp'; gulp.task('default', () => { // do something }); 

Babel 6.0+的更新正如Eric Bronniman所正确指出的那样，在使用最新版本的babel的过程中还需要一些额外的步骤。 以下是这些说明：

再一次，确保你有最新版本的gulp-cli
npm install -g gulp-cli

然后安装gulp，babel核心和es2015预设
npm install --save-dev gulp babel-core babel-preset-es2015

然后，将以下内容添加到.babelrc文件或package.json中

 "babel": { "presets": [ "es2015" ] } 

你的gulpfile.js应该被命名为gulpfile.babel.js

Answer 2

注意，现在可以在Node.js v4.0.0中使用许多/大部分ES6function，而不使用babel。 但显然“import”仍然不被支持。 请参阅： https ： //nodejs.org/en/docs/es6/

编辑 ：大多数stream行的ES6function（包括解构和传播）在NodeJS 5.0默认支持（见上面的链接）。据我所知，唯一主要的缺失function似乎是ES6模块。

Answer 3

我使用babel-node和本地gulp 。

1. 安装babel和gulp作为devDependencies。
2. 用ES6语法编写gulpfile.js 。
3. 使用命令./node_modules/.bin/babel-node ./node_modules/.bin/gulp运行./node_modules/.bin/babel-node ./node_modules/.bin/gulp
4. 在package.json scripts部分，可以跳过第一个./node_modules/.bin/部分 – 作为babel-node ./node_modules/.bin/gulp 。

这个appoach的好处是，有一天，当node.js支持所有的ES6function的一天，所有你需要select退出babel运行时是用nodereplacebabel-node node 。 就这些。

Answer 4

基本上，你需要使用npm安装.babelrc ， .babelrc gulp-babel和babel-resent-env .babelrc babel-resent-env ，将“env”添加到你的.babelrc预置数组中，并使用gulpfile.babel.js文件。

 npm install gulp-babel --save-dev 

其中一些答案提到了babel-core ， babel-preset-es2015等babel-preset-es2015的Babel官方设置指南只使用gulp-babel ，而gulp-babel有依赖模块，包括babel-core所以你不需要单独安装。

关于预设，你需要使用一个预设来使Babel实际上做一些事情，这个预设Env可以根据你支持的环境自动确定你需要的Babel插件。

 npm install babel-preset-env --save-dev 

和.babelrc文件中

 { "presets": ["env"] } 

Answer 5

如果您使用的是最新版本的Gulp和Gulp CLI，那么您只需要执行Gulpfile.babel.js ，默认情况下它将使用BabelJS理解和传输ES6 gulp文件。

在devDependencies下面安装BabelJS transpiler也是很重要的：

 npm install --save-dev babel 

另外请注意，要在这个上下文中使用gulp，你不必导入index.js ，你可以：

 import gulp from 'gulp'; 

Answer 6

在es6中开发gulpfile代码的步骤如下：

• npm install gulp && sudo npm install gulp -g 。
• 请确保您使用的是Gulp的更新版本。 在写这个答案时的最新版本是3.9.1 。 要检查安装了哪个版本的gulp，请inputgulp -v
• npm install babel-core babel-preset-es2015-without-strict --save-dev
• 在terminal中inputtouch .babelrc

• 在.babelrc文件中，添加此代码

  { "presets": ["es2015-without-strict"] }

• 创build了名字为gulpfile.babel.js的gulpconfiguration文件

• 瞧！ 您现在可以在ES6中编写configuration代码。

来源： 使用ES6和Gulp – Mark Goodyear