Gulp - 类型错误：不是函数。如何搜索问题的关键？

Question

gulp文件代码：

let preprocessor = 'sass';

const {app, dest, parallel, watch} = require('gulp'),
      browserSync = require('browser-sync').create(),
      concat = require('gulp-concat'),
      uglify = require('gulp-uglify-es').default(),
      sass = require('gulp-sass'),
      autoprefixer = require('gulp-autoprefixer'),
      cleancss = require('gulp-clean-css'),
      imagemin = require('gulp-imagemin'),
      newer = require('gulp-newer'),
      del = require('del');


function browsersync() {
    browserSync.init({
        server: {'baseDir': 'src/'},
        notify: false,
        online: true
    });
}

function scripts() {
  return app([ 
    'src/js/script.js'
    ])
  .pipe(concat('script.min.js')) 
  .pipe(uglify()) 
  .pipe(dest('src/js/')) 
  .pipe(browserSync.stream());
}

function startwatch() {
  watch(['src/**/*.js', '!src/**/*.min.js'], scripts);
    watch('src/**/' + preprocessor + '/**/*', styles);
    watch('src/**/*.html').on('change', browserSync.reload);
    watch('src/images/**/*', images);
}

function styles() {
  return app('src/' + preprocessor + '/style.' + preprocessor + '')
  .pipe(eval(preprocessor)()) 
  .pipe(concat('style.min.css'))
  .pipe(autoprefixer({ overrideBrowserslist: ['last 10 versions'], grid: true })) 
  .pipe(cleancss( { level: { 1: { specialComments: 0 } }} ))
  .pipe(dest('src/css/'))
  .pipe(browserSync.stream());
}

function images() {
  return app('src/images/**/*') 
  .pipe(newer('src/images')) 
  .pipe(imagemin()) 
  .pipe(dest('src/images'));
}

function cleanimg() {
  return del('src/images/**/*', { force: true });
}

exports.browsersync = browsersync;
exports.scripts = scripts;
exports.styles = styles;
exports.images = images;
exports.cleanimg = cleanimg;
exports.default = parallel(styles, scripts, browsersync, startwatch);

结果：

[21:41:22] 'styles' errored after 38 ms
[21:41:22] TypeError: app is not a function
    at styles (C:\Users\vladi\Desktop\projects\Web\nextPr\gulpfile.js:42:9)
    at bound (domain.js:413:15)
    at runBound (domain.js:424:12)
    at asyncRunner (C:\Users\vladi\Desktop\projects\Web\nextPr\node_modules\async-done\index.js:55:18)
    at processTicksAndRejections (internal/process/task_queues.js:75:11)
[21:41:22] 'default' errored after 70 ms

解释为什么有一个我无法理解的问题。 我已经在谷歌上到处爬行，找不到解决这个问题的方法。 如果您能提供帮助，我将不胜感激。 这段代码部分是从网上拿来的，但是没有找到解决这个问题的办法。 我是网络开发的新手，我仍然很难导航。我找不到可以告诉我或指导我正确方向的人。

Answer 1

错误会准确告诉你问题出在哪一行

at styles (C:\Users\vladi\Desktop\projects\Web\nextPr\gulpfile.js:42:9)

"something is not a function" 表示您将

something

用作函数，例如

something()

，但不是那样（也许它是不同的类型，也许它甚至没有定义 - 例如在这种情况下）。

这会让你看到

app()

。为什么它不是函数？

如果你使用的是外部库——它通常有一个你可以浏览的文档。

在这种情况下，你有

const {app, dest, parallel, watch} = require('gulp')

你会发现

app

库中没有关于

gulp

的内容。

你可能会找到比你从谁知道在哪里复制的例子更好的例子。

Answer 2

更改此行：

const {app, dest, parallel, watch} = require('gulp'),

到

const {src, dest, parallel, watch} = require('gulp'),

我不知道

app

从哪里来，但是gulp没有导出

app

。

然后将所有引用更改为

app

，例如：

return app('src/' + preprocessor + '/style.' + preprocessor + '')

到

return src('src/' + preprocessor + '/style.' + preprocessor + '')