問題描述

問題:如何在 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模板網！