时间戳

首页 > 解决方案 > Gulp - TypeError: 不是一个函数。如何查找问题的关键？

javascript - Gulp - TypeError: 不是一个函数。如何查找问题的关键？

问题描述

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

解释为什么会出现我无法理解的问题。我已经爬遍了谷歌，找不到解决这个问题的方法。如果您能提供帮助，我将不胜感激。我部分地从互联网上获取了这段代码，但没有找到解决这个问题的方法。我是 Web 开发的新手，我仍然很难导航。我找不到能告诉我或指引我正确方向的人。

标签： javascriptgulp

解决方案

下一次 - 错误会准确地告诉您问题出在哪一行。您最终将学会理解某些类型的错误 - 例如“某物不是函数”意味着您将某物用作函数，但事实并非如此（也许它是一种不同的类型，也许它甚至没有定义 - 例如在这个案例）。

这将引导您查看“app()”。为什么不是函数？

如果您使用的是外部库 - 它通常有一个您可以阅读的文档。

在这种情况下，您会发现那里没有关于“应用程序”的内容。您还会找到比您从谁知道在哪里复制的示例更好的示例。

推荐阅读