gulp入門教學

2021-09-14 05:43:55 字數 1128 閱讀 3449

再去安裝 gulp-uglify


建立gulpfile.js


建立壓縮後放檔案的位置(a)


建立需要壓縮的檔案位置(b)


進入gulpfile.js 編輯**


var gulp = require('gulp')


var uglify = require('gulp-uglify')


gulp.task('script',function())
#壓縮css檔案

安裝gulp-minify-css


引用 var gulp = require(gulp)


var minifycss= require(gulp-minify-css)


gulp.task('css',function())
#壓縮images檔案

安裝 gulp-imagemin


引用var gulp = require(gulp)


var imagemin = require('gulp-imagemin')


gulp.task('images',function()))


.pipe(gulp.dest(儲存席位置))


})
#less 壓縮和css同理 只是外掛程式方法不一樣

安裝gulp-less


var gulp=require(gulp)


var less= require(gulp-less)


gulp.task('css',function())
#建立乙個自動檢測檔案修改並且輸入gulp 可以自動執行專案的壓縮；



安裝乙個


npm i -d gulp-babel


npm i -d babel-core


npm i -d babel-preset-env


vim .babelrc


檔案根目錄下面建立乙個.babelrc 檔案裡面儲存乙個


gulp.task('auto',function())


gulp.task('default',['script','images'],['css'])

gulp 入門 使用gulp壓縮css

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

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 模組 用於...

gulp入門學習

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