Vue-搭建

第一步：下載安裝Node.js

windows系統下cmd測試是否安裝成功

Microsoft Windows [版本 10.0.18362.720]
(c) 2019 Microsoft Corporation。保留所有權利。

C:\Users\16238>node -v
v8.11.1

C:\Users\16238>npm -v
6.14.3

C:\Users\16238>

 

出現對應的版本號則安裝成功。

第二部：安裝腳手架CLI

• 全局安裝CLI

npm install -global vue-cli 

 

• 測試是否安裝成功：vue -V 出現對應的版本號則安裝成功。
• 如果報錯，vue不是內部或外部命令。解決辦法：全局配置 vue 的環境變量，找到 vue.cmd 的路徑。將找到的路徑配置到環境變量中：我的電腦===》右擊屬性===》搞基系統設置===》環境變量===》系統變量Path===》新建配置路徑   如：我的路徑是：C:\Users\16238\AppData\Roaming\npm 配置成功錯誤解決。
• 創建一個基於webpack的項目並對這個項目進行一些基礎配置。例如我要將webpack安裝到我的桌面projects文件夾下。則應該 先切換到該文件夾下安裝

 cd desktop/projects

 

vue init webpack my-project

? Project name my-project
? Project description vue知識
? Author zhao
? Vue build standalone
? Install vue-router? (Y/n) y
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n
? Use ESLint to lint your code? No
? Set up unit tests (Y/n) n
? Set up unit tests No
? Setup e2e tests with Nightwatch? (Y/n) n
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recom
? Should we run `npm install` for you after the project has been created? (recom
mended) npm

   vue-cli · Generated "my-project".


# Installing project dependencies ...
# ========================

第三步：安裝依賴

首先打開項目所在的目錄

cd my-project

安裝依賴

npm install

安裝成功後啓動項目

npm run dev

如果啓動後顯示 以下但無法打開瀏覽器

 Your application is running here: http://localhost:8080

解決辦法

找到項目的config文件 打開index.js將箭頭標記的地方設置true再次啓動即可。