gulp打包專案配置

2021-10-08 07:43:42 字數 1994 閱讀 1902

var gulp=

require

('gulp');

var htmlmin =

require

('gulp-htmlmin'

)//壓縮html

var uglify =

require

('gulp-uglify');

//壓縮js

var babel=

require

('gulp-babel');

//es6轉es5

var cleancss=

require

('gulp-clean-css');

//壓縮css

var imagemin =

require

('gulp-imagemin');

//壓縮

var cache =

require

('gulp-cache');

//只處理修改的內容

var clean =

require

('gulp-clean');

//清空資料夾

gulp.

task

('htmlmin'

,function()

;return gulp.

src(

'src/*.html').

pipe

(htmlmin

(options)).

pipe

(gulp.

dest

('dist'))

});// 壓縮js

gulp.

task

('uglifyjs'

,function()

)).pipe

(uglify()

)//加入uglify()的處理

.pipe

(gulp.

dest

('dist/js'))

});/

/ 壓縮css任務

gulp.

task

('css'

,function()

);// 壓縮

gulp.

task

('imagemin'

,function()

').pipe

(cache

(imagemin()

)).pipe

(gulp.

dest

('dist/img'))

;})/

/ 拷貝fonts資料夾

gulp.

task

('copyfonts'

,function()

);// 清空資料夾,保證每次都打包都是最新檔案

gulp.

task

('clean'

,function()

)// gulp.

task

("default"

,gulp.

series

('htmlmin'

,'uglifyjs'

,'css'

,'imagemin'))

;// 這裡這樣寫的意義是有可能會出現一種情況(其他檔案處理速度快的已經處理完了,然後clean最後才執行,會把前面處理完的檔案刪掉,所以要用到gulp.parallel)

gulp.

task

("default"

,gulp.

series

('clean'

,gulp.

parallel

('htmlmin'

,'uglifyjs'

,'css'

,'copyfonts'

,'copylib'

,'copystatic'

,'imagemin'

,'imagemin1'))

);

gulp打包普通html專案

說明 支援配置config輸入目錄 以及輸出目錄 支援hash css js image 有動態更換本地路徑時不建議使用hash 支援合併css js 目前暫不支援合併後js路徑自動替換 支援自動替換html 引用檔案路徑 min.不參與壓縮 hashgulpfile.js 如下 var gulp ...

gulp不生成打包檔案 gulp打包詳解

gulp的作用 刪除檔案中冗餘的內容,壓縮檔案,減小檔案體積 實際專案中執行的都是壓縮完成以後的檔案 減小載入響應時間 gulp打包壓縮物件 html,css,js,sass,webserver 音訊,外掛程式等正常情況下都是打包完成的,直接移動到dist檔案中就可以 伺服器食慾gulp一起繫結執行...

gulp不生成打包檔案 gulp打包詳解

gulp的作用 刪除檔案中冗餘的內容,壓縮檔案,減小檔案體積 實際專案中執行的都是壓縮完成以後的檔案 減小載入響應時間 gulp打包壓縮物件 html,css,js,sass,webserver 音訊,外掛程式等正常情況下都是打包完成的,直接移動到dist檔案中就可以 伺服器食慾gulp一起繫結執行...