各種插件按需求自己選擇,各自功能如下:
1.babel-core babel-preset-es2015 gulp-babel 用于解析es6轉(zhuǎn)換為es5
2.browser-sync 服務(wù)器同步瀏覽
3.gulp-autoprefixer 根據(jù)設(shè)置瀏覽器版本自動(dòng)處理瀏覽器前綴
4.gulp-cache 圖片快取婴削,只有更改過(guò)得圖片會(huì)進(jìn)行壓縮
5.gulp-clean 清空文件夾
6.gulp-cssnano 壓縮CSS代碼
7.gulp-htmlmin 壓縮html
8.gulp-imagemin 圖片壓縮
9.gulp-load-plugins 自動(dòng)加載(超級(jí)有用 省去一大堆代碼)
10.gulp-plumber 管道工 不會(huì)讓錯(cuò)誤爆出來(lái) 繼續(xù)執(zhí)行
11.gulp-sass 預(yù)編譯Sass
12.gulp-size 統(tǒng)計(jì)管道里面內(nèi)容的大小的,上面是用它來(lái)顯示出壓縮前后的大小用來(lái)對(duì)比用
13.gulp-sourcemaps 當(dāng)壓縮的JS出錯(cuò)农渊,能根據(jù)這個(gè)找到未壓縮代碼的位置 不會(huì)一片混亂代碼
14.gulp-uglify JS壓縮
15.gulp-useref 將html引用順序的CSS JS 變成一個(gè)文件
例如: <script src="1.js"></script><script src="2.js"></script> 最后變成<script src="main.js"></script>
16.gulp-rev-append html引用添加版本號(hào)
17.main-bower-files 找到bower.json里配置的 overrides 下配置的main下的路徑
18.wiredep 在.html文件會(huì)把默認(rèn)bower.json的配置自動(dòng)注入到下面標(biāo)簽中去