項(xiàng)目構(gòu)建---全步驟

nodeJS安裝

  • 1.使用bower必須要安裝nodeJS，因?yàn)閎ower就是用nodeJS編寫的，nodeJS是它的運(yùn)行平臺(tái)

  • 2.安裝nodeJS（就是一個(gè)軟件）


  • 3.安裝完后，可以查看node版本（查看到，說明安裝成功）


bower安裝

  • 1.使用npm來下載bower


  • 1.1使用npm uninstall bower來卸載


  • 4.nodeJS安裝完以后，安裝bower。需要全局安裝：在任何一個(gè)文件夾下都能使用bower命令。


  • 5.查看bower版本，可以查看說明成功安裝。


gulp安裝

-6.開啟項(xiàng)目，創(chuàng)建一個(gè)根目錄（根目錄下創(chuàng)建一個(gè)src目錄）


  • 7.把已經(jīng)寫好的gulpfile.js文件放到項(xiàng)目的根目錄當(dāng)中

  • 注意：gulpfile.js文件中有些好的代碼（此處代碼另開一篇文章）


  • 8.創(chuàng)建package.json文件。記錄安裝的所有插件信息。


  • 9.全局安裝gulp，在Desktop處安裝（讓電腦支持gulp）


  • 10.切換到項(xiàng)目的根目錄中，進(jìn)行本地安裝（讓你的項(xiàng)目支持gulp）


    1. 下載gulp所需要的插件
      npm install gulp gulp-less gulp-cssmin gulp-concat gulp-connect gulp-uglify gulp-imagemin open --registry=https://registry.npm.taobao.org --save-dev

  • 12.運(yùn)行項(xiàng)目（gulp）


  • 13.運(yùn)行成功以后會(huì)生成一個(gè)頁面，這個(gè)頁面是在src目錄下的html文件。（這個(gè)頁面內(nèi)容會(huì)和web修改同步，每次修改需要ctrl+s）


最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 前言 眾所周知目前比較火的工具就是gulp和webpack，但webpack和gulp卻有所不同，本人兩者的底層研...
    cduyzh閱讀 1,444評(píng)論 0贊 13
  • 簡介：gulp是前端開發(fā)過程中對(duì)代碼進(jìn)行構(gòu)建的工具，是自動(dòng)化項(xiàng)目的構(gòu)建利器；她不僅能對(duì)網(wǎng)站資源進(jìn)行優(yōu)化，而且在開發(fā)...
    情懷水岸閱讀 887評(píng)論 0贊 5
  • 什么是GULP? GULP 是前端開發(fā)過程中對(duì)代碼進(jìn)行構(gòu)建的工具，是自動(dòng)化項(xiàng)目的構(gòu)建利器；她不僅能 對(duì)...
    碧玉含香閱讀 708評(píng)論 0贊 0
  • 1.背景介紹 gulp是前端開發(fā)過程中對(duì)代碼進(jìn)行構(gòu)建的工具，是自動(dòng)化項(xiàng)目的構(gòu)建利器；它不僅能對(duì)網(wǎng)站資源進(jìn)行優(yōu)化，而...
    cczhuc閱讀 997評(píng)論 0贊 0
  • 在學(xué)習(xí)前，先談?wù)劥笾率褂胓ulp的步驟，給讀者以初步的認(rèn)識(shí)。首先當(dāng)然是安裝nodejs，通過nodejs的npm全...
    amazing_bing閱讀 1,095評(píng)論 0贊 1

友情鏈接更多精彩內(nèi)容