npm init -y //生成 npm install gulp -g //全局安裝 npm install gulp --save-dev //本地安裝并加入package.json npm i -D gulp-babel npm i -D babel-preset-env npm install babel-core babel-preset-es2015 gulp-babel --save-dev //用于解析es6轉換為es5 npm install browser-sync --save-dev //服務器同步瀏覽 npm install gulp-autoprefixer --save-dev //根據設置瀏覽器版本自動處理瀏覽器前綴 npm install gulp-cache --save-dev //圖片快取，只有更改過得圖片會進行壓縮 npm install gulp-clean --save-dev //清空文件夾 npm install gulp-cssnano --save-dev //壓縮CSS代碼 npm install gulp-htmlmin --save-dev //壓縮html npm install gulp-if --save-dev //用于判斷 npm install gulp-imagemin --save-dev //圖片壓縮-很慢 npm install gulp-load-plugins --save-dev //自動加載（超級有用 省去一大堆代碼） npm install gulp-plumber --save-dev //管道工 不會讓錯誤爆出來 繼續執行 npm install gulp-sass --save-dev //預編譯Sass npm install gulp-size --save-dev //統計管道里面內容的大小的,上面是用它來顯示出壓縮前后的大小用來對比用 npm install gulp-sourcemaps --save-dev //當壓縮的JS出錯，能根據這個找到未壓縮代碼的位置 不會一片混亂代碼 npm install gulp-uglify --save-dev //JS壓縮 npm install uglifyjs-webpack-plugin --save-dev //壓縮報錯指引 npm install gulp-useref --save-dev // 將html引用順序的CSS JS 變成一個文件 例如：<!-- build:js scripts/main.js --> <script src="1.js"></script><script src="2.js"></script><!--endbuild--> 最后變成<script src="main.js"></script> npm install gulp-rev-append --save-dev //html引用添加版本號 npm install main-bower-files --save-dev //找到bower.json里配置的 overrides 下配置的main下的路徑 npm install wiredep --save-dev //在.html文件會把默認bower.json的配置自動注入到下面標簽中去 <!-- bower:js --> <!-- endbower --> <!-- bower:css--> <!-- endbower --> 或者直接(注：我一大堆運行會報錯，于是像上邊一個一個運行)： npm install babel-core babel-preset-es2015 browser-sync gulp gulp-autoprefixer gulp-babel gulp-cache gulp-clean gulp-cssnano gulp-htmlmin gulp-if gulp-imagemin gulp-load-plugins gulp-plumber gulp-sass gulp-size gulp-sourcemaps gulp-uglify gulp-useref gulp-rev-append main-bower-files wiredep --save-dev bower init //新建bower.json bower install jquery bootstrap-sass --save-dev //安裝jquery bootstrap