Gulp压缩报错处理

1,200 阅读1分钟

gulp 压缩es6 前端 因为项目没有让使用webpack,没办法只能使用gulp压缩打包,相信大家已经看过很多gulp打包es6,但是按照网上的总是报错 第一个 GulpUglifyError: unable to minify JavaScript 第二个 Error: Cannot find module '@babel/core'

先说第一个,是因为没有gulp-babel, 第二个,是因为没有按照官网把babel升级到7以上 npm install --save-dev @babel/core @babel/cli @babel/preset-env npm install --save @babel/polyfill

这样写就可以了

const gulp = require('gulp'), htmlmin = require('gulp-htmlmin'), uglify = require('gulp-uglify'), cssmin = require('gulp-clean-css'), clean = require('gulp-clean'), babel = require('gulp-babel'), imagemin = require('gulp-imagemin'), runSequence = require('run-sequence');

  gulp.task('clean',function(){
    return gulp.src('es6/**',{read:false})
        .pipe(clean());
});


// html压缩

  gulp.task('htmlmin',()=>{
    gulp.src('./webapp/html/**/*.html')
    .pipe(htmlmin({
        collapseWhitespace: true,
        removeComments: true
    }))
    .pipe(gulp.dest('dist/html'))
  });


  // 压缩js

  gulp.task('uglify',() =>{
      gulp.src('./webapp/js/**/*.js')
      .pipe(babel({
        presets: ["env"]
        // minified: true
      }))
      .pipe(uglify())
      .pipe(gulp.dest('dist/js'))
  });

  // 压缩css
  gulp.task('cssmin',() =>{
    gulp.src('./webapp/css/**/*.css')
    .pipe(cssmin({
      advanced:false,
      compatibility: 'ie7',
      keepBreaks: false,
    }))
    .pipe(gulp.dest('dist/css'))
  })
  // 压缩image

  gulp.task('imagemin',() =>{
    gulp.src('./webapp/img/*.{png,jpg,gif,ico}')
    .pipe(imagemin())
    .pipe(gulp.dest('dist/img'))
  })

  gulp.task("default",['htmlmin','uglify','cssmin','imagemin'],
  );