前端構建工具gulp安裝教程

2021-08-18 10:37:03 字數 1299 閱讀 5372

首先先問自己乙個問題:平時用sass/less寫css,用jade寫/html**,那麼這些檔案的的測試、檢查、合併、壓縮、格式化、部署,監聽。應該怎麼完成呢?就來壓縮合併來講,可以減少多個css,js檔案請求,優化網頁效能,這樣的工作是否應該有乙個很好的解決方案呢?—答案就是gulp。

安裝gulp如下幾個步驟:

為了確保node已經正確安裝,我們執行幾個簡單的命令。

如果都顯示版本號就安裝成功,如果這兩行命令沒有得到返回,可能node就沒有安裝正確,嘗試重啟下命令列工具,如果還不行的話,只能回到第一步進行重灌。

映象使用方法(三種辦法任意一種都能解決問題,建議使用第三種,將配置寫死,下次用的時候配置還在):

1.通過config命令

npm config set registry

npm info underscore (如果上面配置正確這個命令會有字串response)

2.命令列指定

npm –registry info underscore

3.編輯 nodejs\node_modules\npm/.npmrc 加入下面內容

下圖是我完成之後的部分截圖

檢視當前有的源

gem sources -l

移除源

gem sources –remove /

增加源

gem sources -a

新增完用gem sources -l再檢視一下,請確保只有這乙個哦

入門gulp前端構建工具

1.全域性安裝 gulp 倘若之前電腦安裝過,則跳過此步驟 cnpm install g gulp 2.作為專案的開發依賴 devdependencies 安裝 此步驟會自動在目錄下建立package.json檔案,因此無需cnpm init cnpm install s e dev gulp 3....

前端構建工具gulp的使用教程集合

基礎教程 常用外掛程式 系列教程 細節注意 revcollector 路徑替換 詳細介紹 revcollector 路徑替換 預設只首次替換成功 gulp.spritesmith 精靈圖 gulp file include 模板復用功能 npm 映象 以下是我常用的外掛程式package.json ...

gulp前端自動化構建工具

gulp是基於node.js的乙個構建工具 自動任務執行器 開發者可以使用它自動化工作流程。一些常見的 重複的任務,例如 網頁自動重新整理 css預處理 檢測 壓縮 等,只需要簡單的命令就能全部完成。使用它可以簡化工作,提高開發效率。gulp優點 簡潔 gulp側重 優於配置 最直觀的感受,更為簡單...