gulp入坑系列(1)——安裝gulp


前言

  好吧,我承認我是為了搞定Sass編譯CSS文件的問題,迷一樣的着手入gulp的坑,sass和gulp的爬坑歷程大概會一起更新。然后感覺這里windows和mac的流程差不多,不過mac的通常在指令前加sudo ,本喵是windows的本本,所以就以windows的流程為例了。

1. 安裝淘寶cnpm鏡像

   因為很多npm包都是國外的,所以安裝起來很慢,所以我們可以利用淘寶的鏡像服務器來進行安裝后續的包,速度和成功率會高很多。 
所以首先打開cmd,輸入指令: 
npm install -g cnpm –registry=https://registry.npm.taobao.org 
回車以后等待執行便可,安裝完成后可以使用cnpm -v來檢測,如果返回版本號,則說明已經安裝成功了。

2.全局安裝gulp

在命令行中鍵入指令 
cnpm install –global gulp 
這里將官網上的npm改成了cnpm,安裝起來會非常快

3.作為項目的開發依賴安裝:

   首先,新建一個用來項目開發的空文件夾,然后再命令行工具里cd到文件夾中(有git的童鞋在文件夾里直接右鍵 git bash here也是Ok的) 
   然后執行以下 npm init,會發現文件夾中多出一個 
   然后在命令行中執行 npm init,效果如下圖,一路無腦回車即可 
這里寫圖片描述 
   執行完成后你會發現原本的空文件夾里多出了一個叫package.json的文件。說明執行成功啦。 
  完成后接着執行指令: 
  npm install –save-dev gulp 
注意:1.命令行工具一定要進入到這個用來項目開發的空文件夾 
   2.這里不要使用cnpm,使用npm即可(親身經歷,用cnpm之后運行gulp的時候會報錯,大概是cnpm的某些包不全)

  接下來需要等待一會兒,完成后,需要去文件夾的根目錄中,新建一個名為gulpfile.js的javascript文件,寫入內容如下:

1 var gulp = require('gulp');
2 
3 gulp.task('default', function() {
4   // 將你的默認的任務代碼放在這
5 });

最后在命令行里執行指令: glup 回車 
這里寫圖片描述 
效果如上圖,則說明glup已經成功安裝在項目中啦~ 
后續gulp的使用我會繼續學習和更新噠~


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM