簡體   English   中英

Gulp.js縮小,丑化和復制所有文件,但dist文件夾中的應用仍然無法正常工作

[英]Gulp.js minifies, uglifies and copies all the files but still the app in the dist folder doesn't work

我正在做一個項目,這是我第一次嘗試用gulp來組織Web應用程序。

const gulp = require('gulp');
const imagemin = require('gulp-imagemin');
const uglify = require('gulp-uglify');
const cssminify = require('gulp-cssmin');

// Copies html to dist folder
gulp.task('copyHtml', function(){
    return gulp.src('./*.html')
    .pipe(gulp.dest('dist'));
});

gulp.task('imgOpt', function(){
    return gulp.src('./images/{**\/*.*,*.*}')
    .pipe(imagemin())
    .pipe(gulp.dest('dist/images'))
});
gulp.task('minify', function(){
    return gulp.src('./js/*.js')
    .pipe(uglify().on('error', function(e){
        console.log(e);
    }))
    .pipe(gulp.dest('dist/js'));
});

gulp.task('copyAssets', function(){
    return gulp.src('./assets/**/*.*')
    .pipe(gulp.dest('dist/assets'));
});

gulp.task('copyJSON', function(){
    return gulp.src(['!package.json', '*.json'])
    .pipe(gulp.dest('dist'));
});

gulp.task('minifycss', function(){
    return gulp.src('./css/*.css')
    .pipe(cssminify().on('error', function(e){
        console.log(e);
    }))
    .pipe(gulp.dest('dist/css'));
});

gulp.task('copyFonts', function(){
    return gulp.src('./fonts/**/*.*')
    .pipe(gulp.dest('dist/fonts'));
});

gulp.task('default',['copyHtml', 'imgOpt', 'minifycss', 'minify', 'copyAssets', 'copyJSON', 'copyFonts']);

gulp.task('watch', function(){
    gulp.watch('./*.html',['copyHtml']);
    gulp.watch(['!package.json', '*.json'],['copyJSON']);
    gulp.watch('./fonts/**/*.*',['copyFonts']);
    gulp.watch('./assets/**/*.*',['copyAssets']);
    gulp.watch('./images/{**\/*.*,*.*}',['imgOpt']);
    gulp.watch('./css/*.css',['minifycss']);
    gulp.watch('./js/*.js',['minify']);
});

上面是我的gulpfile.js。 當我在git中使用gulp命令處理此文件時,該文件可以正常工作且沒有任何錯誤,並且創建了“ dist”文件夾,但傳輸到dist文件夾的項目全部搞砸了,看起來好像缺少了很多代碼。 我無法檢測到問題。

我的所有JavaScript代碼都在ES5中,因為ES6標准不可接受,並且在此過程中遇到錯誤。

問題解決了。 不好的是,我使用的是舊插件來縮小被貶低的CSS。 現在一切正常。
只需清除一下:gulp-minify-css和gulp-cssmin是gulp的較舊插件,目前尚未使用。 取而代之的是,使用gulp-clean-css來縮小CSS。

https://github.com/jakubpawlowicz/clean-css

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM