gulpfile.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. const gulp = require("gulp"),
  2. htmlmin = require("gulp-htmlmin"),
  3. minifyCss = require("gulp-minify-css"),
  4. sass = require("gulp-sass"),
  5. uglify = require("gulp-uglify"),
  6. babel = require("gulp-babel"),
  7. connect = require("gulp-connect");
  8. removeUseStrict = require("gulp-remove-use-strict");
  9. // gulp.task('default', () => {
  10. // console.log("default");
  11. // });
  12. gulp.task("html", () => {
  13. gulp.src("src/**/*.html")
  14. .pipe(htmlmin({
  15. removeComments: true,//清除HTML注释
  16. collapseWhitespace: true,//压缩HTML
  17. collapseBooleanAttributes: true,//省略布尔属性的值 <input checked="true"/> ==> <input checked />
  18. removeEmptyAttributes: true,//删除所有空格作属性值 <input id="" /> ==> <input />
  19. removeScriptTypeAttributes: false,//删除<script>的type="text/javascript"
  20. removeStyleLinkTypeAttributes: true,//删除<style>和<link>的type="text/css"
  21. minifyJS: true,//压缩页面JS
  22. minifyCSS: true//压缩页面CSS
  23. }))
  24. .pipe(gulp.dest("dist"))
  25. .pipe(connect.reload());
  26. })
  27. gulp.task("css", () => {
  28. gulp.src("src/css/*.css")
  29. .pipe(sass())
  30. .pipe(minifyCss())
  31. .pipe(gulp.dest("dist/css"))
  32. .pipe(connect.reload());
  33. })
  34. gulp.task("js", () => {
  35. gulp.src("src/js/**/*.js")
  36. .pipe(removeUseStrict())
  37. .pipe(babel({
  38. presets: ['@babel/env']
  39. }))
  40. .pipe(uglify())
  41. .pipe(gulp.dest("dist/js"))
  42. .pipe(connect.reload());
  43. })
  44. gulp.task("lib" ,() => {
  45. gulp.src("src/libs/**/*")
  46. .pipe(gulp.dest("dist/libs"))
  47. .pipe(connect.reload());
  48. })
  49. gulp.task("img", () => {
  50. gulp.src("src/imgs/**/*")
  51. .pipe(gulp.dest("dist/imgs"))
  52. .pipe(connect.reload());
  53. })
  54. // 监听文件的改变,然后自动执行对应的任务
  55. gulp.task("watch", () => {
  56. // 监听所有html文件的改变,然后执行html任务
  57. gulp.watch("src/**/*.html", ["html"]);
  58. gulp.watch("src/js/**/*.js", ["js"]);
  59. gulp.watch("src/css/**/*.scss", ["css"]);
  60. })
  61. gulp.task("default", ["html", "js", "css", "lib", "img", "watch"]);