gulp - 为什么在构建项目时会出现问题？

问题描述

以前一切正常，即使在这个项目中，一开始也没有问题，现在它不会敲任何错误，但是当您输入gulp或gulp build命令时，如果您尝试几次，程序集就会停止，然后程序集成功完成，如果gulp命令有效，对css和js进行更改，那么一切正常，但是如果您对html进行一些更改，则这不会反映在浏览器中，您需要重新启动所有内容。

[13:51:33] Using gulpfile D:\Work\Taker Corporation\Automation\gulpfile.js
[13:51:33] Starting 'default'...
[13:51:33] Starting 'clean'...
[13:51:33] Finished 'clean' after 6.71 ms
[13:51:33] Starting 'build'...
[13:51:33] Starting 'clean'...
[13:51:33] Finished 'clean' after 272 μs
[13:51:33] Starting 'html:build'...

[Browsersync] Serving files from: dist/
[13:51:56] Starting 'html:build'...
[Browsersync] Reloading Browsers... (buffered 9 events)

"use strict";

var gulp = require("gulp"),
    autoprefixer = require("gulp-autoprefixer"),
    cssbeautify = require("gulp-cssbeautify"),
    removeComments = require('gulp-strip-css-comments'),
    rename = require("gulp-rename"),
    sass = require("gulp-sass"),
    rigger = require("gulp-rigger"),
    uglify = require("gulp-uglify"),
    watch = require("gulp-watch"),
    plumber = require("gulp-plumber"),
    run = require("run-sequence"),
    rimraf = require("rimraf"),
    webserver = require("browser-sync");



/* Paths to source/build/watch files
=========================*/

var path = {
    build: {
        html: "dist/",
        js: "dist/assets/js/",
        css: "dist/assets/css/",
        img: "dist/assets/img/",
        fonts: "dist/assets/fonts/",
        json: "dist/assets/"
    },
    src: {
        html: "src/*.{htm,html,php}",
        js: "src/assets/js/*.js",
        css: "src/assets/sass/*.scss",
        img: "src/assets/img/**/*.*",
        fonts: "src/assets/fonts/**/*.*",
        json: "src/assets/*.json"
    },
    watch: {
        html: "src/**/*.{htm,html,php}",
        js: "src/**/*.js",
        css: "src/**/*.scss",
        img: "src/assets/img/**/*.*",
        fonts: "src/assets/fonts/**/*.*",
        json: "src/assets/*.json"
    },
    clean: "./dist"
};



/* Webserver config
=========================*/

var config = {
    server: "dist/",
    notify: false,
    open: true,
    ui: false
};



/* Tasks
=========================*/

gulp.task("webserver", function () {
    webserver(config);
});


gulp.task("html:build", function () {
    return gulp.src(path.src.html)
    .pipe(plumber())
    .pipe(rigger())
    .pipe(gulp.dest(path.build.html))
    .pipe(webserver.reload({stream: true}));
});


gulp.task("css:build", function () {
    gulp.src(path.src.css)
    .pipe(plumber())
    .pipe(sass().on('error', sass.logError))
    .pipe(autoprefixer({
        browsers: ["last 8 versions"],
        cascade: true
    }))
    .pipe(cssbeautify())
    .pipe(gulp.dest(path.build.css))
    .pipe(webserver.reload({stream: true}));
});


gulp.task("js:build", function () {
    gulp.src(path.src.js)
    .pipe(plumber())
    .pipe(rigger())
    .pipe(gulp.dest(path.build.js))
    .pipe(uglify())
    .pipe(rename("main.min.js"))
    .pipe(gulp.dest(path.build.js))
    .pipe(webserver.reload({stream: true}));
});


gulp.task("fonts:build", function() {
    gulp.src(path.src.fonts)
    .pipe(gulp.dest(path.build.fonts));
});


gulp.task("image:build", function () {
    gulp.src(path.src.img)
    .pipe(gulp.dest(path.build.img));
});


gulp.task("json:build", function() {
    gulp.src(path.src.json)
    .pipe(gulp.dest(path.build.json));
});


gulp.task("clean", function (cb) {
    rimraf(path.clean, cb);
});


gulp.task('build', function (cb) {
    run(
        "clean",
        "html:build",
        "css:build",
        "js:build",
        "fonts:build",
        "image:build",
        "json:build"
        , cb);
});


gulp.task("watch", function() {
    watch([path.watch.html], function(event, cb) {
        gulp.start("html:build");
    });
    watch([path.watch.css], function(event, cb) {
        gulp.start("css:build");
    });
    watch([path.watch.js], function(event, cb) {
        gulp.start("js:build");
    });
    watch([path.watch.img], function(event, cb) {
        gulp.start("image:build");
    });
    watch([path.watch.fonts], function(event, cb) {
        gulp.start("fonts:build");
    });
    watch([path.watch.json], function(event, cb) {
        gulp.start("json:build");
    });
});


gulp.task("default", function (cb) {
   run(
       "clean",
       "build",
       "webserver",
       "watch"
   , cb);
});

标签： gulp

gulp - 为什么在构建项目时会出现问题？

问题描述

解决方案

推荐阅读