1. 程式人生 > >折騰第一個vue工程

折騰第一個vue工程

抱怨兩句:這麼簡單的安裝工作,浪費了好長時間,還解除安裝重灌node.js,重啟了電腦好幾次,網上搜羅的辦法各式各樣!

正題:

步驟:

1、官網下載當前最新的node.js版本:https://nodejs.org/dist/v10.13.0/node-v10.13.0-x64.msi

下載完成之後直接點選安裝,安裝完成之後開啟dos命令視窗,輸入:

node -v

這時會列印node版本資訊:

然後輸入:

npm -v

這是會列印npm的版本資訊:(安裝node.js之後預設安裝了npm)

之後輸入:(安裝vue)

npm install -g vue

安裝完成之後在輸入:(安裝vue-cli腳手架)

npm install -g vue-cli

安裝完成之後輸入vue,會列印如下資訊:

到此,說明vue安裝成功,加下來可以通過vue-cli腳手架建立專案了:

2、cd到需要存放vue工程的檔案目錄,然後輸入:

vue init webpack

生成的目錄如下:(根據不同的引數,生成的檔案內容會有些許差別)

然後在dos命令列接著輸入:(安裝一些依賴)

npm install

接著在輸入:(編譯vue工程)

npm run build

這個時候會生成一個編譯後的資料夾,如下圖:

最後輸入:(啟動vue工程)

npm run dev

在瀏覽器位址列輸入:http://127.0.0.1:8080,出現下面的頁面標識vue專案建立並啟動成功

 

問題記錄:

npm是一個安裝工具,網上的教程一般都會說直接用npm安裝會很慢,還會因為網路問題帶來很多副作用,所以推薦再安裝一個淘寶的映象,然後使用cnpm命令,體驗之後發現,非但沒有網友說的快如飛的速度,安裝vue的時候還報錯,然後上網蒐羅解決方案,失敗,重灌node.js 重啟電腦也沒用,後來想想直接用npm試試,結果成功了,速度也很快,也就幾分鐘......