1. 程式人生 > 實用技巧 >[Vue音樂專案] 第一節 環境搭建

[Vue音樂專案] 第一節 環境搭建

1.Node安裝

  1. 登入官網,下載最新版本並安裝;
  2. 在我的電腦內,執行以下操作:右鍵->屬性->高階->環境變數->系統變數->path 檢視是否有node的安裝路徑,沒有的話新增上node的安裝路徑;
  3. 開始->執行->cmd 輸入node -v ,出現類似v10.15.3的字樣說明安裝成功。

2.vue-cli安裝

  1. 開啟cmd命令列,輸入npm install vue-cli -g,等待安裝完成;
  2. 完成後,輸入 vue -V,出現類似2.9.6的字樣表明安裝成功。

2.初始化專案

  1. 在準備放置專案的資料夾裡,開啟cmd並輸入vue init webpack music
    (music為專案目錄名字,可自定義),按照命令輸入相應的內容;
  2. 完成後,依次輸入cd music(專案目錄),npm run dev命令,等待完成;
  3. 完成後,安裝給出的地址,在瀏覽器輸入localhost:8080,可訪問表明初始化成功;
  4. 在安裝資料夾裡,music目錄下包含如下內容:
    //music資料夾
    build   --打包工具及開發配置
    config  --配置目錄
    nodemodules --依賴模組
    src --原始碼目錄
        assets --靜態檔案
        components --元件
        App.vue --應用級元件
        main.js --入口檔案
    static --靜態檔案
    index.html --首頁
    //部分檔案於專案關係不大,故此省略