gulp教程之gulp-minify-css【gulp-clean-css】

原文:http://www.ydcss.com/archives/41

簡介:

使用gulp-minify-css壓縮css文件,減小文件大小,并給引用url添加版本號避免緩存。重要:gulp-minify-css已經被廢棄,請使用gulp-clean-css,用法一致。

1、安裝nodejs/全局安裝gulp/本地安裝gulp/創建package.json和gulpfile.js文件

1.1、gulp基本使用還未掌握?請參看:?gulp詳細入門教程

1.2、本示例目錄結構如下:

2、本地安裝gulp-minify-css

2.1、github:https://github.com/jonathanepollack/gulp-minify-css

2.2、安裝:命令提示符執行?cnpm install gulp-minify-css --save-dev

2.3、注意:沒有安裝cnpm請使用?npm install gulp-minify-css --save-dev?什么是cnpm,如何安裝?

2.4、說明:--save-dev?保存配置信息至 package.json 的 devDependencies 節點。為什么要保存至package.json?

3、配置gulpfile.js

3.1、基本使用

3.2、gulp-minify-css 最終是調用clean-css,其他參數查看這里

3.3、給css文件里引用url加版本號(根據引用文件的md5生產版本號),像這樣:

3.3、若想保留注釋,這樣注釋即可:

4、執行任務

4.1、命令提示符執行:gulp testCssmin

轉載于:https://www.cnblogs.com/HendSame-JMZ/articles/6183034.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/456709.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/456709.shtml
英文地址,請注明出處:http://en.pswp.cn/news/456709.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

大數據面試題總結(附答案)

文章目錄前言hadoop相關試題Hive相關試題Hbase相關試題Storm相關試題Spark相關試題Java基礎試題其他前言 最近由于要準備面試就開始提早看些面試、筆試題。以下是自己總結的一些經常出現、有價值的試題,包含hadoop、hive、hbase、storm、spark等。答案僅供參考&…

win7 IE11卸載后無法上網

今天某同事需要訪問一個銀行網站,必須使用IE8,我在win7中降級IE11,直接卸載了IE11和其語言包,發現IE8再也打不開網頁了,每次打開都提示保存html網頁。測試Google Chrome上網完全沒有問題。IE8的internet選項等任何工具菜單點擊均無反應&#…

關于django的模板

模板 問題 如何向請求者返回一個漂亮的頁面呢? 肯定需要用到html、css,如果想要更炫的效果還要加入js,問題來了,這么一堆字段串全都寫到視圖中,作為HttpResponse()的參數嗎?這樣定義就太麻煩了吧&#x…

Hbase簡介及常用命令相關知識總結

文章目錄目錄前言:1.Hbase簡介1.1、什么是Hbase1.2、與傳統數據庫的對比1.3、Hbase集群中的角色2、Hbase數據模型3、Hbase命令總結:目錄 前言: 對于Hbase來說,由于其是基于列的數據庫,所以比傳統的數據庫快許多&…

Django中模型類 屬性-學習筆記

定義屬性 Django根據屬性的類型確定以下信息: 當前選擇的數據庫支持字段的類型渲染管理表單時使用的默認html控件在管理站點最低限度的驗證 django會為表創建自動增長的主鍵列,每個模型只能有一個主鍵列,如果使用選項設置某屬性為主鍵列后d…

Angular Redux

Angular Redux 轉載于:https://www.cnblogs.com/skating/p/6185878.html

AtomicInteger相關類

在java6以后我們不但接觸到了Lock相關的鎖,也接觸到了很多更加樂觀的原子修改操作,也就是在修改時我們只需要保證它的那個瞬間是安全的即可,經過相應的包裝后可以再處理對象的并發修改,以及并發中的ABA問題,本文講述At…

Storm入門簡介

目錄前言:1、Storm簡介2、Storm與Hadoop的區別3、Storm核心組件4、Storm編程模型5、流式計算一般架構圖(重要)總結: 目錄 前言: 在介紹Storm之前,先介紹下離線計算。 離線計算:批量獲取數據…

項目完成

完成示例項目 現在還需要的代碼包括三個方面,三個方面順序不分先后。 1.定義視圖2.定義URLconf3.定義模板 定義視圖 編寫booktest/views.py文件如下: from django.shortcuts import render from booktest.models import BookInfo#首頁,展…

前端模板預編譯技術

什么是前端模板預編譯 前端模板預編譯通過預編譯技術讓前端模板突破瀏覽器限制,實現后端模板一樣的同步“文件”加載能力。它采用目錄來組織維護前端模板,從而讓前端模板實現工程化管理,最終保證前端模板在復雜單頁 web 應用下的可維護性。同…

Python如何生成windows可執行的exe文件

打包工具 pyinstaller 安裝pyinstaller 如果你的網絡穩定,通常直接使用下面的命令安裝即可: pip install pyinstaller 當然了,你也可以下載pyinstaller源碼包,然后進入包目錄執行下面的命令,同樣可以安裝&#xff…

招商銀行信用卡中心華泰證券暑期實習軟開筆試小結

白菜自動化小碩一枚,18屆,下學期就正式要找工作了,沒有實習經驗,感覺心慌慌。現在學校里已經開始各種提前招實習,內推了,so暑假想提前試試水,投一投暑期實習。 看到心水的單位就投一投&#xff…

理想的程序猿

出處 | http://guoze.me 最近看到的一篇不錯的文章,分享一下。 我算是靠坑蒙拐騙進了程序員的門,然后一路狂奔。26歲之前幾乎沒有任何寫代碼的經驗,研究生畢業卻意外選擇了一家不可能提供培訓的初創公司,在每日擔憂公司倒閉、害…

node08-express

目錄:node01-創建服務器 node02-util node03-events node04-buffer node05-fs node06-path node07-http node08-express node09-cookie express模塊: 1 /*2 * express是一個應用框架3 * 1、路由4 * 2、中間件5 * 3、模板引擎6 * */7 8 var express requ…

【python】1. 兩數之和

給定一個整數數組 nums 和一個目標值 target,請你在該數組中找出和為目標值的那 兩個 整數,并返回他們的數組下標。 你可以假設每種輸入只會對應一個答案。但是,你不能重復利用這個數組中同樣的元素。 示例: 給定 nums [2, 7, 11, 15], t…

The user specified as a definer (#39;root#39;@#39;%#39;) does not exist

通常是因為root用戶對全局host無訪問權限。因此僅僅要給root用戶加入一個訪問權限就可以。解決的方法: 登陸mysql 。運行 mysql -u root -pPasswd mysql >grant all privileges on *.* to root"%" identified by "Passwd…

Java基礎常見筆試題總結

以下是自己總結的一些Java常見的基礎知識題,答案僅供參考,如有異議請指出。一直保持更新狀態。 1.什么是Java虛擬機?為什么Java被稱作是“平臺無關的編程語言”? Java虛擬機是一個可以執行Java字節碼的虛擬機進程。Java源文件被編…

ThreadLocal的練習代碼

場景: 有三個小孩兒,買了一個變形金剛玩具(Transformer).... 三個小孩都爭著玩這個玩具....沒有一個人可以玩... 第一種方式:每個人各玩一會.... 第二種方式:再買兩個玩具,一個人玩一個. 每個小孩都當成一個線程.三個小孩就有三個線程. Child.java 2 3 import java.util.Random…

nginx+uwsgi部署Django

本篇文章主要介紹了解決nginxuwsgi部署Django的所有問題(小結),小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧 最近,自己暑假寫的小項目也算完畢了,想著投放到自己云服務器上&#xff0…

$(document).scrollTop()與$(window).scrollTop()

$(document).scrollTop() 獲取垂直滾動的距離 即當前滾動的地方的窗口頂端到整個頁面頂端的距離 要獲取頂端 只需要獲取到scrollTop()0的時候 就是頂端了 要獲取底端 只要獲取$(document).scrollTop()>(document).height()?(window).height() 就可以知道已經…