是否可以在 es6 中编写 gulpfile?

问题描述

问题:如何在 ES6 中编写我的 gulp 文件，以便我可以使用 import 而不是 require 并使用 => 语法优于 function()?

Question: How can I write my gulp file in ES6 so I can use import instead of require and use => syntax over function()?

我可以使用 io.js 或 node 任何版本.

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在这个 堆栈

Inside the node_modules/gulp/bin/gulp.js i've changed the first line to #!/usr/bin/env node --harmony as asked in this stack

推荐答案

是的，你可以使用 babel.

确保您拥有最新版本的 gulp-cli.

Make sure you've got the latest version of the gulp-cli.

npm install -g gulp-cli

安装 babel 作为项目的依赖.

Install babel as a dependency of the project.

npm install --save-dev babel

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

您的 gulpfile 可能如下所示:

Your gulpfile might look something like this:

import gulp from 'gulp';

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

Babel 6.0+ 更新正如 Eric Bronniman 正确指出的那样，要让它与最新版本的 babel 一起工作，还需要一些额外的步骤.以下是这些说明:

Update for Babel 6.0+ As correctly pointed out by Eric Bronniman, there are a few extra steps involved in getting this to work with the latest version of babel. Here are those instructions:

再次确保您拥有最新版本的 gulp-cli
npm install -g gulp-cli

Again, make sure you've got the latest version of gulp-cli
npm install -g gulp-cli

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

Then install gulp, babel core, and the es2015 presets
npm install --save-dev gulp babel-core babel-preset-es2015

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

Then, either add the following to a .babelrc file or to your package.json

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

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

这篇关于是否可以在 es6 中编写 gulpfile?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持html5模板网！