2016-08-27 3 views
1

ich eine weniger Aufgabe in meinem Gulp Skript, aber es funktioniert nicht wie es soll:Gulp Weniger Aufgabe nichts zu tun

Es soll weniger Dateien zusammenstellen und sie zu ‚build/css‘ bewegen Mappe. Aber aus irgendeinem Grund funktioniert es nicht. Warum?

Ich habe versucht, gulp-util zu verwenden, um Fehler zu protokollieren. Es wird ein falscher Dateiname in weniger importierten Dateien erzeugt. Aber es erkennt keine undefinierten Klassen. Und es zeigt nicht an, warum Dateien nicht kompiliert werden.

Alle Hinweise werden sehr geschätzt!

gulpfile.js

var gulp   = require("gulp"), 
    util   = require('gulp-util'), 
    minifyHTML  = require("gulp-minify-html"), 
    concat   = require("gulp-concat"), 
    uglify   = require("gulp-uglify"), 
    cssmin   = require("gulp-cssmin"), 
    uncss   = require("gulp-uncss"), 
    imagemin  = require("gulp-imagemin"), 
    sourcemaps  = require("gulp-sourcemaps"), 
    inject   = require("gulp-inject"), 
    less   = require("gulp-less"), 
    filter   = require("gulp-filter"), 
    glob   = require("glob"), 
    browserSync = require("browser-sync"), 
    LessPluginAutoPrefix = require('less-plugin-autoprefix'), 
    autoprefix  = new LessPluginAutoPrefix({ 
     browsers: ["last 2 versions"] 
    }); 

var config = { 
    paths: { 
     html: { 
      src: "src/**/*.html", 
      dest: "build" 
     }, 
     javascript: { 
      src: ["src/js/**/*.js"], 
      dest: "build/js" 
     }, 
     css: { 
      src: ["src/css/**/*.css"], 
      dest: "build/css" 
     }, 
     less: { 
      src: ["src/less/**/*.less", "!src/less/includes/**"], 
      dest: "build/css" 
     }, 
     images: { 
      src: ["src/images/**/*.jpg", "src/images/**/*.jpeg", "src/images/**/*.png"], 
      dest: "build/images" 
     }, 
     audio: { 
      src: "src/audio/**/*.mp3", 
      dest: "build/audio" 
     } 
    } 
}; 

gulp.task("html", function(){ 
    return gulp.src(config.paths.html.src) 
     .pipe(minifyHTML()) 
     .pipe(gulp.dest(config.paths.html.dest)); 
}); 

gulp.task("scripts", function(){ 
    return gulp.src(config.paths.javascript.src) 
     .pipe(sourcemaps.init()) 
     .pipe(concat("app.min.js")) 
     .pipe(uglify()) 
     .pipe(sourcemaps.write()) 
     .pipe(gulp.dest(config.paths.javascript.dest)); 
}); 

gulp.task("css", function(){ 
    return gulp.src(config.paths.css.src) 
     .pipe(sourcemaps.init()) 
     .pipe(cssmin()) 
     .pipe(sourcemaps.write(".")) 
     .pipe(gulp.dest(config.paths.css.dest)) 
     .pipe(browserSync.reload({stream: true})); 
}); 

gulp.task("less", function(){ 
    return gulp.src(config.paths.less.src) 
     .pipe(sourcemaps.init()) 
     .pipe(less({ 
      paths: ["node_modules/bootstrap/less"], 
      plugins: [autoprefix] 
     })) 
     .pipe(uncss({ 
      html: glob.sync(config.paths.html.src) 
     })) 
     .pipe(concat("main.min.css")) 
     .pipe(sourcemaps.write(".")) 
     .pipe(gulp.dest(config.paths.less.dest)) 
     .pipe(filter("**/*.css")) 
     .pipe(browserSync.reload({stream: true})); 
}); 

gulp.task("images", function(){ 
    return gulp.src(config.paths.images.src) 
     .pipe(imagemin({ 
      progressive: true, 
      interlaced: true 
     })) 
     .pipe(gulp.dest(config.paths.images.dest)); 
}); 

gulp.task("audio", function() { 
    return gulp.src([config.paths.audio.src]).pipe(gulp.dest(config.paths.audio.dest)); 
}); 

gulp.task("browser-sync", function() { 
    browserSync({ 
     server: { 
      baseDir: "./build" 
     } 
    }); 
}); 

gulp.task("build", ["html", "scripts", "css", "less", "images", "audio"]); 

gulp.task("default", ["build", "browser-sync"], function(){ 
    gulp.watch(config.paths.html.src, ["html", browserSync.reload]); 
    gulp.watch(config.paths.javascript.src, ["scripts", browserSync.reload]); 
    gulp.watch(config.paths.css.src, ["css"]); 
    gulp.watch(config.paths.less.src, ["less"]); 
    gulp.watch(config.paths.images.src, ["images", browserSync.reload]); 
    gulp.watch(config.paths.audio.src, ["audio", browserSync.reload]); 
}); 

package.json

{ 
    "name": "ofj-simon-says", 
    "version": "0.1.0", 
    "description": "Click a color sequence", 
    "main": "index.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1" 
    }, 
    "author": "", 
    "license": "ISC", 
    "devDependencies": { 
    "bower": "^1.3.12", 
    "browser-sync": "^2.14.0", 
    "glob": "^7.0.6", 
    "gulp": "^3.8.10", 
    "gulp-concat": "^2.4.1", 
    "gulp-cssmin": "^0.1.6", 
    "gulp-filter": "^4.0.0", 
    "gulp-imagemin": "^3.0.3", 
    "gulp-inject": "^4.1.0", 
    "gulp-less": "^3.1.0", 
    "gulp-minify-html": "^1.0.6", 
    "gulp-sourcemaps": "^1.2.8", 
    "gulp-uglify": "^2.0.0", 
    "gulp-uncss": "^1.0.6", 
    "gulp-util": "^3.0.7", 
    "less-plugin-autoprefix": "^1.5.1", 
    "main-bower-files": "^2.4.0" 
    }, 
    "dependencies": { 
    "bootstrap": "^3.3.7" 
    } 
} 

Antwort

0

scheint ein Problem mit Schluck-uncss Plugin zu sein. Wenn ich es entferne, funktioniert alles. Ich habe versucht, auf die neueste Version 1.0.6 zu aktualisieren, aber ohne Erfolg. Ich werde tiefer hineinschauen müssen, bevor ich das Problem sagen kann. Für jetzt entferne ich uncss() von der weniger Aufgabe:

gulp.task("less", function(){ 
    return gulp.src(config.paths.less.src) 
     .pipe(sourcemaps.init()) 
     .pipe(less({ 
      plugins: [autoprefix] 
     }).on('error', util.log)) 
     .pipe(concat('main.min.css')) 
     //.pipe(uncss({ 
     // html: glob.sync(config.paths.html.src) 
     //})) 
     .pipe(nano()) 
     .pipe(sourcemaps.write(".")) 
     .pipe(gulp.dest(config.paths.less.dest)) 
     .pipe(browserSync.reload({stream: true})); 
});