成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

簡簡單單學(xué)習(xí)gulp的入門與使用

meteor199 / 3103人閱讀

摘要:的使用首先,我們需要在官網(wǎng)下載插件,地址如下在這個(gè)網(wǎng)站我們可以尋找到自己需要的插件以為例,然后在項(xiàng)目下打開命令提示行,輸入以下命令然后我們在里輸入一下代碼引入插件調(diào)用插件輸出位置

gulp的入門與使用

安裝

使用

gulp的入門 安裝

安裝gulp需要使用到nodo.js,安裝鏈接如下:
http://jingyan.baidu.com/arti...

安裝完成之后我們以全局安裝gulp
打開命令提示行,輸入以下命令:

npm install gulp-cli -g

然后我們建立自己的項(xiàng)目
在自己的項(xiàng)目目錄下,打開命令提示行,因?yàn)槲覀冃枰?
" package.json "文件,所以我們需要輸入以下命令:

npm init

之后我們需要在項(xiàng)目目錄下安裝gulp
輸入以下命令

npm install gulp -D

我們還需要自己手動(dòng)建立一個(gè)gulpfile.js文件,
打開gulpfile.js,輸入以下代碼:

var gulp = require("gulp");
// 引入gulp
gulp.task("default", function() {
  console.log("測試");
});

在剛剛的命令提示行輸入:

gulp

得到以下輸出

Using gulpfile F:webgulpfile.js
Starting "default"...
測試
Finished "default" after

說明你的gulp已經(jīng)安裝成功。

gulp的使用

首先,我們需要在gulp官網(wǎng)下載插件,地址如下:

https://gulpjs.com/plugins/

在這個(gè)網(wǎng)站我們可以尋找到自己需要的插件(以gulp-imagemin為例),然后在項(xiàng)目下打開命令提示行,輸入以下命令:

npm install --save-dev gulp-imagemin --save-dov

然后我們在gulpfile.js里輸入一下代碼:

const imagemin = require("gulp-imagemin");
// 引入插件
gulp.task("default", () =>
    gulp.src("src/images/*")
        .pipe(imagemin())
        // 調(diào)用插件
        .pipe(gulp.dest("dist/images"))
        // 輸出位置
);

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/91433.html

相關(guān)文章

  • webpack 3 零基礎(chǔ)入門教程 #1 - 介紹

    摘要:所以它在某些程度上,跟的功能有些相同。嚴(yán)格上講,模塊化不是他強(qiáng)調(diào)的東西,他旨在規(guī)范前端開發(fā)流程。更是明顯強(qiáng)調(diào)模塊化開發(fā),而那些文件壓縮合并預(yù)處理等功能,不過是他附帶的功能。 1. webpack 是什么? showImg(https://segmentfault.com/img/remote/1460000012293461); 先來說一下 webpack 是什么。 webpack 的...

    張紅新 評論0 收藏0
  • 前端構(gòu)建工具gulp入門教程

    摘要:本文假設(shè)你之前沒有用過任何任務(wù)腳本和命令行工具,一步步教你上手。如果這兩行命令沒有得到返回,可能就沒有安裝正確,嘗試重啟下命令行工具,如果還不行的話,只能回到第一步進(jìn)行重裝。 本文假設(shè)你之前沒有用過任何任務(wù)腳本(task runner)和命令行工具,一步步教你上手Gulp。不要怕,它其實(shí)很簡單,我會(huì)分為五步向你介紹gulp并幫助你完成一些驚人的事情。那就直接開始吧。 第一步:安裝No...

    kuangcaibao 評論0 收藏0
  • Gulp使用入門

    摘要:是一款流式構(gòu)建系統(tǒng),如果說是基于任務(wù)執(zhí)行器,就是基于的文件流任務(wù)執(zhí)行器,比起有如下特點(diǎn)使用方便通過代碼優(yōu)于配置的策略,可以讓簡單的任務(wù)簡單,復(fù)雜的任務(wù)更可管理。 作者:Jogis原文鏈接:https://github.com/yesvods/Blog/issues/1轉(zhuǎn)載請注明原文鏈接以及作者信息 showImg(http://itanguo.cn/wp-content/uploads...

    ShevaKuilin 評論0 收藏0
  • 前端資源系列(4)-前端學(xué)習(xí)資源分享&前端面試資源匯總

    摘要:特意對前端學(xué)習(xí)資源做一個(gè)匯總,方便自己學(xué)習(xí)查閱參考,和好友們共同進(jìn)步。 特意對前端學(xué)習(xí)資源做一個(gè)匯總,方便自己學(xué)習(xí)查閱參考,和好友們共同進(jìn)步。 本以為自己收藏的站點(diǎn)多,可以很快搞定,沒想到一入?yún)R總深似海。還有很多不足&遺漏的地方,歡迎補(bǔ)充。有錯(cuò)誤的地方,還請斧正... 托管: welcome to git,歡迎交流,感謝star 有好友反應(yīng)和斧正,會(huì)及時(shí)更新,平時(shí)業(yè)務(wù)工作時(shí)也會(huì)不定期更...

    princekin 評論0 收藏0

發(fā)表評論

0條評論

最新活動(dòng)
閱讀需要支付1元查看
<