溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

gulp4中出現(xiàn)assert.js throw err AssertionError錯(cuò)誤怎么辦

發(fā)布時(shí)間:2021-10-19 09:42:52 來(lái)源:億速云 閱讀:152 作者:小新 欄目:web開(kāi)發(fā)

這篇文章主要介紹了gulp4中出現(xiàn)assert.js  throw err  AssertionError錯(cuò)誤怎么辦,具有一定借鑒價(jià)值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。

前情:

  • 由于更換電腦,重裝環(huán)境,在gulp的時(shí)候總是報(bào)錯(cuò)

assert.js:350
    throw err;
    ^
AssertionError [ERR_ASSERTION]: Task function must be specified
    at Gulp.set [as _setTask]

查了很久才發(fā)現(xiàn)是gulp3.9.1和4.0的差別造成的。

gup3 VS gulp4 區(qū)別

Gulp 4最大的變化就是你不能像以前那樣傳遞一個(gè)依賴任務(wù)列表。
Gulp3,如果有一個(gè)任務(wù)A,B和C的列表,你想在一個(gè)序列中運(yùn)行A,B,和C,代碼如下:

gulp.task('default', ['A', 'B, 'C']);

在Gulp 4中,你不能再這樣做了。你會(huì)得到以下錯(cuò)誤:

assert.js:350
    throw err;
    ^

AssertionError [ERR_ASSERTION]: Task function must be specified
    at Gulp.set [as _setTask] (D:\python\project\前端工程化\shop\node_modules\undertaker\lib\set-task.js:1
0:3)
    at Gulp.task (D:\python\project\前端工程化\shop\node_modules\undertaker\lib\task.js:13:8)
    at Object.<anonymous> (D:\python\project\前端工程化\shop\gulpfile.js:34:6)
    at Module._compile (internal/modules/cjs/loader.js:688:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (internal/modules/cjs/helpers.js:20:18)

不要用Gulp3的方式指定依賴任務(wù),你需要使用gulp.series和gulp.parallel,因?yàn)間ulp任務(wù)現(xiàn)在只有兩個(gè)參數(shù)。
gulp.series:按照順序執(zhí)行
gulp.paralle:可以并行計(jì)算

gulp.task('my-tasks', gulp.series('a', 'b', 'c', function() {
  // Do something after a, b, and c are finished.
}));
gulp.task('build', gulp.parallel('styles', 'scripts', 'images', function () {
  // Build the website.
}));

或者這樣

gulp.task('my-tasks', gulp.series('a', gulp.parallel('styles','scripts', 'images'), 'b', 'c', function() {
  // Do something after a, b, and c are finished.
}));

相關(guān)任務(wù)必須在被調(diào)用之前發(fā)生

在Gulp 3中,可以讓你的文件引用它們之前的任務(wù),因?yàn)橐磺卸际悄J(rèn)異步執(zhí)行的?,F(xiàn)在,您需要在依賴關(guān)系在您的gulp文件中定義之后放置調(diào)用依賴項(xiàng)的任務(wù)。否則,你會(huì)得到這樣的錯(cuò)誤:

assert.js:85
  throw new assert.AssertionError({
  ^
AssertionError: Task never defined: serve
    at getFunction (D:\python\project\前端工程化\shop\node_modules\undertaker\lib\helpers\normalizeArgs.js:15:5)
    at arrayMap (D:\python\project\前端工程化\shopnode_modules\lodash.map\index.js:140:21)
    at map (D:\python\project\前端工程化\shopnode_modules\lodash.map\index.js:1836:10)
    at normalizeArgs (D:\python\project\前端工程化\shopnode_modules\undertaker\lib\helpers\normalizeArgs.js:19:10)
    at Gulp.series (D:\python\project\前端工程化\shopnode_modules\undertaker\lib\series.js:13:14)
    at Object.<anonymous> (D:\python\project\前端工程化\shop/gulpfile.js:41:27)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)

解決方法:使依賴任務(wù)在文件的底部。
gulp4中需要指定task結(jié)束
gulp4中,必須告訴gulp我們的task任務(wù)已經(jīng)完成了。gulp3中,我們不必要這么做,因?yàn)槿绻麤](méi)有發(fā)出異步完成信號(hào),那么當(dāng)任務(wù)返回時(shí),gulp會(huì)認(rèn)為它已經(jīng)完成了,gulp4中必須明確指出任務(wù)完成了。

使用回調(diào)函數(shù)作為您的任務(wù)的第一個(gè)參數(shù),只需在完成時(shí)調(diào)用該函數(shù)。

gulp.task('clean', function(done) {
  del(['build]);
    done();
});

告訴gulp任務(wù)完成的另一個(gè)常見(jiàn)方法是 返回(return) 一個(gè)流或者 Promise

gulp.task('minify:js', function() {
  return gulp.src('client/**/*.js')
    .pipe(minify())
    .pipe(gulp.dest('build'));
});
gulp.task('message', function() {
  return new Promise(function(resolve, reject) {
    console.log("HTTP Server Started");
    resolve();
  });
});

瀏覽器同步刷新,而不是樣式注入

我的Gulp 3文件沒(méi)有問(wèn)題,在HTML重建上進(jìn)行刷新,并在CSS更改上進(jìn)行閃電般的風(fēng)格注入,但升級(jí)到Gulp 4后,瀏覽器現(xiàn)在會(huì)在CSS更改后重新加載。

  • 需要以不同的方式做三件事。首先確保您將一個(gè)文件數(shù)組傳遞給Browsersync構(gòu)造函數(shù)

var bsConfig = {
    server: 'build',
    files: [
        'build'
    ],
    open: false,
};

gulp.task('browserSync', function() {
    bs.init(bsConfig);
});
  • 其次,如果你有任務(wù)bs.stream()結(jié)束styles,你可以刪除它。

  • 第三,當(dāng)你想在你的開(kāi)發(fā)服務(wù)器上進(jìn)行實(shí)時(shí)風(fēng)格注入時(shí),你的watch和browserSync任務(wù)需要并行運(yùn)行,    而不是終止,就像這樣:

gulp.task('serve', gulp.series('build', gulp.parallel('watch', 'browserSync')));

感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“gulp4中出現(xiàn)assert.js  throw err  AssertionError錯(cuò)誤怎么辦”這篇文章對(duì)大家有幫助,同時(shí)也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI