gulp自動化使用札記(1)安裝

一,node環境的準備

1,node的安裝和卸載。

    卸載直接在控制面板中卸載即可。

  安裝:

    (1),從Node.js官網下載對應平臺的安裝程序,網速慢的童鞋請移步國內鏡像。在Windows上安裝時務必選擇全部組件,包括勾選Add to Path。
  打開命令提示符輸入node -v,檢驗是否安裝成功。
  輸入node 進入,node.js的交互環境,在交互環境下可以任意輸入JavaScript語句。連按兩次Ctrl+C。退出node環境.
2,npm
  npm其實是Node.js的包管理工具(node.js package manager)。  
  npm類似於maven是一個包管理工具,因爲我們在Node.js上開發時,會用到很多別人寫的JavaScript代碼。如果我們要使用別人寫的某個包,每次都根據名稱搜索一下官方網站,下載代碼,解壓,再使用,非常繁瑣。於是一個集中管理的工具應運而生:大家都把自己開發的模塊打包後放到npm官網上,如果要使用,直接通過npm安裝就可以直接用,不用管代碼存在哪,應該從哪下載。
更重要的是,如果我們要使用模塊A,而模塊A又依賴於模塊B,模塊B又依賴於模塊X和模塊Y,npm可以根據依賴關係,把所有依賴的包都下載下來並管理起來。否則,靠我們自己手動管理,肯定既麻煩又容易出錯。
   npm已經在Node.js安裝的時候順帶裝好了。我們在命令提示符或者終端輸入npm -v,
 常用命令  
  npm -v 查看版本號 
  npm config list  查看配置
  npm config ls -l  查看所有默認設置
  配置淘寶鏡像:npm config set registry "https://registry.npm.taobao.org
  安裝cnpm:npm install -g cnpm -registry=https://registry.npm.taobao.org
 
    npm的默認安裝路徑 C:\Users\Administrator\AppData\Roaming\npm
   使用npm安裝的模塊   C:\Users\Administrator\AppData\Roaming\npm\node_modules
 
3.package.json
  
描述npm包的文件,類型maven的pom.xml,bower的bower.json等
有了package.json才能使用npm install命令,就會在當前目錄中安裝所需要的模塊
使用 npm init 用來創建package.json配置文件
  
  1. 相關命令和屬性說明
  2. 屬性說明: 
  3. dependencies:生產環境需要安裝的包 
  4. devDependencies:開發環境需要的包 
  5.  
  6. npm install:默認使用當前路徑下的package.json安裝包 
  7. npm install chajian:直接安裝包到當前目錄的node_modules 
  8. -g:全局安裝 
  9. --save-dev:安裝同時寫入package.json 

二,gulp的安裝

   gulp是需要項目執行的,所以你全局安裝了gulp還是不能執行,需要當前項目也安裝才能執行構建:
  npm install gulp --save-dev 所以gulp是安裝到當前項目的
  一,首先全局安裝gulp
  npm install -g gulp 
  1. npm是安裝node模塊的工具,執行install命令
  2. -g表示在全局環境安裝,以便任何項目都能使用它
  3. 最後,gulp是將要安裝的node模塊的名字
  gulp -v 查看是否安裝成功
    二,將gulp安裝到項目本地
      1,定位項目目錄,這裏使用webstrom打開項目,直接在控制檯進行。
        2,  npm init 用來創建package.json配置文件
          3,npm install --save-dev gulp
           4, 需要去文件夾的根目錄中,新建一個名爲gulpfile.js的javascript文件,寫入內容如下:
    var gulp = require('gulp');
      gulp.task('default', function() {
        // 將你的默認的任務代碼放在這
      });
 
    最後在命令行裏執行指令: glup 回車 ,//啓動gulp
    [10:30:37] Using gulpfile E:\wu_work\zhiguH5\gulpfile.js
    [10:30:37] Starting 'default'...
    [10:30:37] Finished 'default' after 64 μs
 
    說明gulp已經成功安裝在項目中了,並且執行成功
    
  
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章