2

gulp 4 を使用しているときにサブタスクに問題があります。gulp 3 では、タスクをいくつかのファイルに分割し、gulp-load-subtasksを使用してそれらをロードして実行します。gulp 4 を使用しているときに、タスクをロードしようとすると問題が発生しました。例:タスクbがロードされる前にタスク a (タスク b に依存)をロードできません。これをやろうとすると、エラーが発生しました。AssertionError: Task never defined: b

これは私のフォルダです：

gulpflie.babel.js workflow/ common.js task/ a.js b.js

gulp 4 でサブタスクを整理するにはどうすればよいですか?

4

1 に答える 1

3

私は自分のタスクをあなたのようなファイルに整理しましたが、ES6 インポート/エクスポートを使用しています。

例: 私はクリーン、スクリプト、および gulpfile.babel.js のタスクを実行しました。内容は次のとおりです tasks/clean.js。

import promisedDel from 'promised-del';

let cleanTaskCreator = (config) => {
  let task = (done) => {
    return promisedDel((typeof config.path === 'string' ? [config.dest] : config.dest));
  };
  task.displayName = 'clean:' + config.name;
  task.description = 'clean task for ' + config.name;
  return task;
};

export default cleanTaskCreator;

tasks/scripts.js:

import gulp from 'gulp';
import named from 'vinyl-named';
import webpack from 'webpack-stream';

import {scripts as config} from '../config.js';
import clean from "./clean";

let scripts = () => {
  return gulp.src(config.entries)
    .pipe(named())
    .pipe(webpack(config.webpackConfig))
    .pipe(gulp.dest(config.dest));
};

scripts.displayName = 'scripts';
scripts.description = 'generation of scripts assets';

if(process.env.NODE_ENV !== 'production') {
  let realScripts = scripts;
  scripts = gulp.series(clean(config), realScripts);
  scripts.displayName = 'clean&scripts';
  scripts.description = 'clean scripts and ' + scripts.description;
}

export default scripts;

そして最後にgulpfile.babel.js：

import * as gulp from "gulp"
import scripts from "./gulp/tasks/scripts";

gulp.task(scripts);

let defaultTask = gulp.series(scripts);
defaultTask.displayName = 'default';
defaultTask.description = 'default';
gulp.task(defaultTask);

すべてのタスクは、実行される関数を公開し、そのすべての依存関係を内部的に定義します (タスク スクリプトでわかるように、運用環境の場合は、世代の前にアセットをクリーンアップします)。次に、メイン ファイルで、これらの関数のみをインポートし、メイン タスク (クラシック デフォルト) とコマンド ラインから到達可能なその他のタスクを定義します。

これが gulp4 を使用してプロジェクト (大小を問わず) を整理するのに最適なモード (または正しいモード) であるかどうかはわかりませんが、私にとってはこのレイアウトで問題ありません。

最後に、gulp-load-subtasks のようなモジュールは gulp4 では機能しません。これは、(指摘したように) ファイル名順にスクリプトをロードするためです。

于 2016-09-07T16:51:05.847 に答える