gulp基本入門

gulp是乙個前端自動化構建的乙個工具

1.前置:

1..1在使用gulp之前，先安裝node和npm

2.安裝gulp:

2.1 npm install gulp

3.打包專案:

3.1 新建gulpfile.js

// 獲取 gulp

var gulp = require('gulp')
// 獲取 uglify 模組（用於壓縮 js）
var uglify = require('gulp-uglify')
// 壓縮 js 檔案
// 在命令列使用 gulp script 啟動此任務
gulp.task('script', function() )
// 在命令列使用 gulp auto 啟動此任務
gulp.task('auto', function () )
// 使用 gulp.task('default') 定義預設任務
// 在命令列使用 gulp 啟動 script 任務和 auto 任務
gulp.task('default', ['script', 'auto'])

3.2 新建package.json

{}

3.3 執行打包

gulp test

3.4 說明

gulp.src()：:獲取原始檔

pipe()：管道

uglify()：壓縮原始檔

gulp.dest()：處理後檔案另存為

gulp 入門 使用gulp壓縮css

壓縮 css 可降低 css 檔案大小，提高頁面開啟速度。規律轉換為 gulp 找到css 目錄下的所有 css 檔案，壓縮它們，將壓縮後的檔案存放在dist css 目錄下。一 安裝 gulp minify css 模組 在命令列輸入sudo npm install gulp minify css...

gulp入門教學

再去安裝 gulp uglify 建立gulpfile.js 建立壓縮後放檔案的位置 a 建立需要壓縮的檔案位置 b 進入gulpfile.js 編輯 var gulp require gulp var uglify require gulp uglify gulp.task script func...

gulp入門學習

我們本該將更多的精力放在更有意義的事情上 所以，grunt gulp這一類構件工具出現了，將我們解救於重複的工作中。就自己的理解，自動化構件工具的核心是將我們的工作流抽離為乙個個任務 task 根據我們自己的需求，css的合併壓縮可以為乙個任務 js的合併壓縮可以為乙個任務 的壓縮也可以為乙個任務，...