基於node平臺開發的前端構建工具
將機械化操作編寫成任務,想要執行機械化操作執行一個命令行命令任務就能被自動執行了
用機器代替手工,提高開發效率
Gulp能做什麼呢
1、項目上線,HTML,CSS、JS文件壓縮合並
2、語法轉換(es6, less..)
3、公共文件抽離
4、修改文件瀏覽器自動刷新
Gulp使用
1、使用npm install gulp 下載gulp庫文件
2、在項目根目錄下簡歷gulpfile.js文件
3、重構項目的文件夾結構src目錄放置碼代碼文件dist目錄放置構建後文件
4、在gulpfile.js文件中編寫任務
5、在命令行工具中執行gulp任務
Gulp中提供的方法
1、gulp.src; 獲取任務要處理的文件
2、gulp.dest(); 輸出文件
3、gulp.task(); 建立gulp任務
4、gulp.watch();監控文件的變化
Gulp插件
1、gulp-htmlmin: html文件壓縮
2、gulp-csso:壓縮css
3、gulp-babel:JavaScript 語法轉換
4、gulp-less:less語法轉換
5、gulp-uglify: 壓縮混淆JavaScript
6、gulp-file-include: 公共文件包含
7、browersync: 瀏覽器實時同步