Gulp似乎正在工作,但构建文件尚未处理

时间:2016-06-01 17:54:10

标签: javascript node.js gulp

我的问题

我一直在使用gulp作为我正在研究的这个项目的任务运行者 - 这是一个简单的网站。我有一个src目录,我可以在其中完成所有编码,存储我的所有资产,如脚本,图像,图标等。

到目前为止,gulp一直在做自动加前缀和缩小我的CSS文件,它一直在压缩我的图像,缩小JavaScript和我的HTML。然后它将所有内容发送到build目录,这就是我上传到服务器的内容。一切都一直持续到今天。

问题在于gulp似乎正在运行:它在终端中运行正常,它构建了一个“构建”目录,所有项目文件和资产都在那里。但是,似乎没有任何处理过程。

我尝试过什么

  • 删除构建目录并再次运行gulp:Gulp创建一个新构建,一切似乎都有效,但没有一个文件被处理过。

  • npm uninstall然后,npm install:我想也许有可能重新安装我所有的依赖项来解决问题 - 但不是。

  • google:显然我已经尝试过寻找解决方案了。问题是我没有找到与我的问题相关的问题(如果有的话我的应用程序)。

在我看来,我的问题确实源于Gulp无所事事的事实。我根本没有收到任何错误,但显然出现了问题。

我的环境btw ......

我在Windows 10上运行。没有服务器正在运行,或者没有任何持续集成,浏览器刷新或任何其他自动化任务。我只是在一个目录中编写代码,Gulp正在处理该代码和资产,并将其输出到build目录。

我正在使用的插件是:

  • 吞-autoprefixer

  • 吞-htmlmin

  • 吞洁净的CSS

  • 吞-丑化

  • 吞-imagemin

  • 吞掉-除去-HTML的评论

我使用的唯一包管理器是npm没有凉亭或其他任何东西。

实际问题

所以,如果不清楚...为什么gulp构建我的项目但不输出正确的文件?或者,文件是否正确,但某种程度上正在跳过处理?

提前非常感谢!

至于任何其他信息,我很乐意分享所需的信息。但是没有错误,因此没有可以共享的日志。这是gulpfile.js

var gulp = require('gulp');
var autoprefixer = require('gulp-autoprefixer');
var htmlmin = require('gulp-htmlmin');
var cleanCSS = require('gulp-clean-css');
var uglify = require('gulp-uglify');
var imagemin = require('gulp-imagemin');
var removeHtmlComments = require('gulp-remove-html-comments');


gulp.task('imagemin', function() {
    return gulp.src(['src/**/**/*', '!src/images/**/*.db'])
      .pipe(imagemin())
      .pipe(gulp.dest('build/'));
});

gulp.task('minify-js', function() {
  return gulp.src(['src/**/*.js'])
    .pipe(uglify())
    .pipe(gulp.dest('build/'));
});

gulp.task('minify-html', function() {
  return gulp.src('src/**/*.html')
    .pipe(removeHtmlComments())
    .pipe(htmlmin({collapseWhitespace: true}))
    .pipe(gulp.dest('build/'))
});

gulp.task('prefix', function () {
    return gulp.src('./src/**/*.css')
        .pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false
        }))
        .pipe(cleanCSS({compatibility: 'ie8'}))
        .pipe(gulp.dest('build/'));
});


gulp.task('default', ['prefix', 'minify-html', 'minify-js', 'imagemin'], function() {
    gulp.watch(['src/css/*.css'], ['prefix']);
    gulp.watch(['src/**/*.html'], ['minify-html']);
    gulp.watch(['src/**/*js'], ['minify-js']);
    gulp.watch(['src/images/**/*'], ['imagemin']);
});

1 个答案:

答案 0 :(得分:2)

所以我最终发现了问题。

起初我的gulp任务似乎没有明显的原因重新开始工作。我很困惑为什么和浪费了一个小时的调查后没有运气我只是向前推进了发展。

直到今天,我才刚刚忍受这样一个事实,即有时构建会起作用,有时候不行。

问题出在imagemin任务中。src/**/**/*应该是src/images/**/*。愚蠢的错误对我而言,但希望这可以帮助其他有类似问题的人 - 如果有的话。

构建有时有效,有时不工作的原因是,有时imagemin任务会先完成它的工作,然后其他任务就可以了。但是,如果imagemin最后完成,则该任务将解除之前所有处理,因为它在src中的所有文件上运行。