1、gulp學習筆記1
2、gulp學習筆記2
3、gulp學習筆記3
4、gulp學習筆記4
壓縮 css **可降低 css 檔案大小，提高頁面開啟速度。
目標：找到css/目錄下的所有 css 檔案，壓縮它們，將壓縮後的檔案存放在dist/css/目錄下。
在壓縮之前，需要安裝新的模組，輸入以下命令列：
npm install gulp-minify-css
在對應目錄建立gulpfile.js檔案並寫入如下內容：
//獲取 gulp
var gulp = require('gulp')
//獲取 minify-css 模組（用於壓縮 css）
var minifycss = require('gulp-minify-css')
//壓縮 css 檔案
//在命令列使用 gulp css 啟動此任務
gulp.task('css', function
() )
此時在命令列輸入：
gulp css
gulp 會建立dist/css目錄，並建立對應的.css檔案，此檔案存放壓縮後的 css **。
壓縮 檔案可降低檔案大小，提高載入速度。
目標：找到images/目錄下的所有檔案，壓縮它們，將壓縮後的檔案存放在dist/images/目錄下。
在壓縮之前，需要安裝新的模組，輸入以下命令列：
npm install gulp-imagemin
在對應目錄建立gulpfile.js檔案並寫入如下內容：
//獲取 gulp
var gulp = require('gulp');
//獲取 gulp-imagemin 模組
var imagemin = require('gulp-imagemin')
//壓縮任務
//在命令列輸入 gulp images 啟動此任務
gulp.task('images', function
() ))
//3. 另存
.pipe(gulp.dest('dist/images'))
});
此時在命令列輸入：
gulp images
在gulpfile.js對應目錄建立images資料夾，並在images/目錄下存放。
less 是一門 css 預處理語言，它擴充了 css 語言，增加了諸如變數、混合（mixin）、函式等功能，讓 css 更易維護。
在編譯之前，需要安裝新的模組，輸入以下命令列：
npm install gulp-less
在對應目錄建立gulpfile.js檔案並寫入如下內容：
//獲取 gulp
var gulp = require('gulp')
//獲取 gulp-less 模組
var less = require('gulp-less')
//編譯less
//在命令列輸入 gulp less 啟動此任務
gulp.task('less', function
() );
此時在命令列輸入：
gulp less
在gulpfile.js對應目錄建立dist/css資料夾，並在 dist/css目錄下存放。
1、gulp詳細入門教程:
2、gulp api 文件:
3、gulp 入門指南:
3\
Gulp學習筆記（二）
實戰！專案目錄如下 已經新建了gulpfile.js了 1.自動化編譯scss 需要用到的外掛程式 gulp sass 用來編譯scss gulp plumber 如果編譯過程出錯的話程序會終止，這個外掛程式就可以讓它再次啟動，不需要人工操作 實現 const gulp require gulp s...
gulp學習記錄
1.gulp的作用 以js為例，我們可能需要先把coffeescript轉譯成js，然後做一次語法檢查，然後再壓縮合併，最後才部署到生產。gulp就是用來把上述流程自動化的，並且現在像gulp和grunt這種工具一般都提供額外的實時重新整理伺服器，就是說，在開發過程中監視你的檔案改變，實時來幫你重新...
gulp入門學習
我們本該將更多的精力放在更有意義的事情上 所以，grunt gulp這一類構件工具出現了，將我們解救於重複的工作中。就自己的理解，自動化構件工具的核心是將我們的工作流抽離為乙個個任務 task 根據我們自己的需求，css的合併壓縮可以為乙個任務 js的合併壓縮可以為乙個任務 的壓縮也可以為乙個任務，...