?

gulp是基于node實現的，那么我們就需要先安裝node

打開 https://nodejs.org/ 點擊綠色的 INSTALL 按鈕下載安裝 node。

以下操作是在Windows環境下運行。

打開命令行Windows+R 或者開始-運行-cmd打開

安裝nodejs（此處省略nodejs的安裝方式，有需要可去node官網查看詳細教程）

在命令行通過cd..跳轉到所在項目 也可直接在所在項目通過shift+鼠標右鍵-->點擊在此處打開命令窗口

npm 是 node 的包管理工具，可以利用它安裝 gulp 所需的包。（在安裝 node 時已經自動安裝了 npm）

使用npm全局安裝gulp

在命令行輸入全局安裝gulp

? ? ?npm install -g gulp ?或者使用cnpm install -g gulp

作為項目的開發依賴（devDependencies）安裝：

npm install --save-dev gulp 1、安裝壓縮插件

? ? ?命令：npm install gulp-minify-css 或者 cnpm install gulp-minify-css

2、新建一個gulpfile.js文件

//壓縮css //獲取gulp var gulp = require('gulp')//獲取minify-css模塊（用于壓縮css） var minifyCss = require('gulp-minify-css') //壓縮css文件 //在命令行使用gulpcss啟動此任務 gulp.task('css',function(){//1.找到文件gulp.src('views/css/*.css')//2.壓縮文件 .pipe(minifyCss())//3.另存為壓縮文件.pipe(gulp.dest('views/dist/css')) }) //在命令使用gulp auto啟動此文件 gulp.task('auto',function(){//監聽文件修改，當文件被修改則執行css任務gulp.watch('views/css/*.css',['css']) });//使用gulp.task('default')定義默認任務 //在命令行使用gulp啟動script任務和auto任務 gulp.task('default',['css','auto'])

3、執行

? ? ?gulp

ps：如直接復制gulpfile.js文件，需更改項目地址

轉載于:https://www.cnblogs.com/CaktyRiven/p/6419477.html

總結

以上是生活随笔為你收集整理的gulp自动化构建工具--压缩css--学习笔记的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。