gulp的使用

gulp是一個構(gòu)建工具哥捕,可以通過它自動執(zhí)行網(wǎng)站開發(fā)過程中的公共任務(wù),例如:編譯sass/less,編譯壓縮混淆javaScript,合并編譯模板和版本控制等浅辙。

安裝gulp

首先扭弧,檢測node.js是否存在,因?yàn)間ulp的使用需要node環(huán)境记舆。

接著鸽捻,在項(xiàng)目目錄中安裝gulp為本地模塊

本地安裝gulp

npm install --save-dev gulp

最后,安裝項(xiàng)目中依賴的 gulp plugin模塊gulp-cssmin, gulp-jshint

npm install --save-dev gulp-cssmin gulp-jshint

使用

首先泽腮,在根目錄中創(chuàng)建一個gulpfile文件御蒲。然后寫.....

var gulp = require('gulp'); //加載gulp模塊
var uglifyJs = require('gulp-uglify'); //加載uglify模塊
var cleanCss = require('gulp-clean-css'); //加載clean模塊
//定義一個壓縮js代碼的任務(wù)
gulp.task('uglifyJs', [], function() {
gulp.src('build/.js') //找到原始文件
.pipe(uglifyJs()) //壓縮js代碼
.pipe(gulp.dest('js')); //壓縮后的代碼儲存在這里
});
// //定義一個壓縮css代碼的任務(wù)
//gulp.task('cleanCss', [], function() {
// gulp.src('gulp/
.css') //找到原始文件
// .pipe(cleanCss()) //壓縮css代碼
// .pipe(gulp.dest('gulp/build')); //壓縮后的代碼儲存在這里
//});
// //定義一個監(jiān)聽任務(wù)
gulp.task('watch', function() {
//監(jiān)聽文件,一旦文件有變化诊赊,就執(zhí)行相應(yīng)的任務(wù)
gulp.watch('build/.js', ['uglifyJs']);
// gulp.watch('gulp/
.css', ['cleanCss']);
});
// //默認(rèn)執(zhí)行的任務(wù), 執(zhí)行完數(shù)組中的任務(wù)之后厚满,再執(zhí)行當(dāng)前任務(wù)
gulp.task('default', ['uglifyJs'], function() {
console.log('執(zhí)行完畢');
});

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市碧磅,隨后出現(xiàn)的幾起案子碘箍,更是在濱河造成了極大的恐慌遵馆,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,126評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件丰榴,死亡現(xiàn)場離奇詭異货邓,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)四濒,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,254評論 2 382
  • 文/潘曉璐 我一進(jìn)店門换况,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人盗蟆,你說我怎么就攤上這事戈二。” “怎么了喳资?”我有些...
    開封第一講書人閱讀 152,445評論 0 341
  • 文/不壞的土叔 我叫張陵觉吭,是天一觀的道長。 經(jīng)常有香客問我骨饿,道長亏栈,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,185評論 1 278
  • 正文 為了忘掉前任宏赘,我火速辦了婚禮绒北,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘察署。我一直安慰自己闷游,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,178評論 5 371
  • 文/花漫 我一把揭開白布贴汪。 她就那樣靜靜地躺著脐往,像睡著了一般。 火紅的嫁衣襯著肌膚如雪扳埂。 梳的紋絲不亂的頭發(fā)上业簿,一...
    開封第一講書人閱讀 48,970評論 1 284
  • 那天,我揣著相機(jī)與錄音阳懂,去河邊找鬼梅尤。 笑死,一個胖子當(dāng)著我的面吹牛岩调,可吹牛的內(nèi)容都是我干的巷燥。 我是一名探鬼主播,決...
    沈念sama閱讀 38,276評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼号枕,長吁一口氣:“原來是場噩夢啊……” “哼缰揪!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起葱淳,我...
    開封第一講書人閱讀 36,927評論 0 259
  • 序言:老撾萬榮一對情侶失蹤钝腺,失蹤者是張志新(化名)和其女友劉穎抛姑,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體拍屑,經(jīng)...
    沈念sama閱讀 43,400評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡途戒,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,883評論 2 323
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了僵驰。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 37,997評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡唁毒,死狀恐怖蒜茴,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情浆西,我是刑警寧澤粉私,帶...
    沈念sama閱讀 33,646評論 4 322
  • 正文 年R本政府宣布,位于F島的核電站近零,受9級特大地震影響诺核,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜久信,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,213評論 3 307
  • 文/蒙蒙 一窖杀、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧裙士,春花似錦入客、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,204評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至啃炸,卻和暖如春铆隘,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背南用。 一陣腳步聲響...
    開封第一講書人閱讀 31,423評論 1 260
  • 我被黑心中介騙來泰國打工膀钠, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人训枢。 一個月前我還...
    沈念sama閱讀 45,423評論 2 352
  • 正文 我出身青樓托修,卻偏偏與公主長得像,于是被迫代替她去往敵國和親恒界。 傳聞我的和親對象是個殘疾皇子睦刃,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,722評論 2 345

推薦閱讀更多精彩內(nèi)容

  • 在現(xiàn)在的前端開發(fā)中,前后端分離十酣、模塊化開發(fā)涩拙、版本控制际长、文件合并與壓縮、mock數(shù)據(jù)等等一些原本后端的思想開始...
    Charlot閱讀 5,431評論 1 32
  • gulpjs是一個前端構(gòu)建工具兴泥,與gruntjs相比工育,gulpjs無需寫一大堆繁雜的配置參數(shù),API也非常簡單搓彻,學(xué)...
    井皮皮閱讀 1,291評論 0 10
  • gulpjs是一個前端構(gòu)建工具如绸,與gruntjs相比,gulpjs無需寫一大堆繁雜的配置參數(shù)旭贬,API也非常簡單怔接,學(xué)...
    小裁縫sun閱讀 921評論 0 3
  • 1、gulp的安裝 首先確保你已經(jīng)正確安裝了nodejs環(huán)境稀轨。然后以全局方式安裝gulp: npm install...
    F_imok閱讀 2,353評論 1 11
  • gulpjs是一個前端構(gòu)建工具扼脐,與gruntjs相比,gulpjs無需寫一大堆繁雜的配置參數(shù)奋刽,API也非常簡單瓦侮,學(xué)...
    依依玖玥閱讀 3,148評論 7 55