vue開發環境搭建步驟詳解
1.首先安裝node, npm環境(http://nodejs.cn/download/)
node.js安裝配置步驟(https://www.runoob.com/nodejs/nodejs-install-setup.html)
安裝完成之後可以查詢到你安裝的node版本和npm版本,你電腦的環境變數也多出PATH
windows需要進行npm全域性環境變數配置(如果不進行npm全域性環境變數配置,你在其他盤下面下載npm包是會報錯的)
1.首先找到你安裝npm的路徑
然後複製標紅路徑,找到計算機的高階設定裡面的環境變數,找到後在系統變數下面新建一個變數
變數名:NODE_PATH 變數值:C:\Program Files\nodejs\node_modules(你安裝npm的路徑)點選確定就完成了。
2.npm淘寶映象(因為國外映象下載太慢,換成國內映象下載更快)
在命令列輸入命令npm config get registry 顯示的是https://registry.npm.taobao.org就是對的
如果顯示https://registry.npmjs.org設定命令npm config set registry https://registry.npm.taobao.org
3.環境配置完成後,我們用vue-cli腳手架來進行開發
在本地新建資料夾vue,然後通過命令找到本資料夾然後輸入命令npm install vue-cli -g
下載完成輸入vue --version 會出現你下載的vue-cli版本
初始化專案:輸入命令vue init webpack my-project(專案名稱)
● Project name:專案名稱,如果不需要更改直接回車就可以了。
● Project description:專案描述,預設為 A Vue.js project 直接回車,不用編寫。
● Author:作者,如果你有配置 git 的作者,它會讀取。
● Install vue-router?是否安裝vue的路由外掛,我們這裡需要安裝,選擇y
● Use ESLint to lint your code?是否用 ESLint 來限制你的程式碼錯誤和風格。我們這裡輸入n,如果是大型團隊開發,最好進行配置。
● setup unit tests ?是否需要安裝單元測試工具,我們這裡不需要,輸入n。
● Setup e2e tests with Nightwatch?是否安裝 e2e 來進行使用者行為模擬測試,我們這裡不需要,輸入n;
● Should we run ` npm install ` for you after the project has been created?是否在我們的專案建立後執行 npm install,它會有三個選項,我們選擇第一個執行選項,然後回車。
安裝完成後會出現提示,讓你進入專案目錄然後npm run dev執行專案,執行完成在瀏覽器搜尋欄裡輸入localhost:8080就會出現下面頁面,基本專案就搭建好了。
&n