如何搭建vue專案

2022-06-15 14:18:10 字數 1709 閱讀 4758

一、安裝node環境

2.檢查安裝是否成功

1) ctrl+r 輸入cmd

2) 輸入node -v 如果有版本號,就代表安裝成功

二、安裝npm 

1.使用**映象安裝效率會高點(通過cmd入口安裝也可以,此處我是在專案裡面通過git安裝的) 

2.輸入 cnpm -v 檢查是否安裝成功

三、搭建vue環境專案

1.全域性安裝 vue -cli

1)輸入vue -v 檢查是否安裝過vue-cli,有版本號即已安裝可直接跳過繼續執行第2步

遇到上的問題最直接的方法是解除安裝重灌,網上關於配置環境的方法我沒有嘗試

解除安裝原有的: npm uninstall vue-cli

然後清除快取: npm cache clean

重新安裝:npm install vue

npm intall vue-cli -g

最後檢視vue-cli 版本:vue -v 

2. 進入你的專案目錄(我是在桌面建了乙個bc的資料夾),建立乙個基於 webpack 模板的新專案: vue init webpack 專案名

1)輸入 vue init webpack 專案名  沒有響應

遇到上面這種情況檢查下自己是否沒有安裝依賴包,去執行下第二步的1步驟,然後繼續走下面步驟

說明:vue build ==> 打包方式,回車即可;

install vue-router ==> 是否要安裝 vue-router,專案中肯定要使用到 所以y 回車;

use eslint to lint your code ==> 是否需要 js 語法檢測 目前我們不需要 所以 n 回車;

set up unit tests ==> 是否安裝 單元測試工具 目前我們不需要 所以 n 回車;

setup e2e tests with nightwatch ==> 是否需要 端到端測試工具 目前我們不需要 所以 n 回車;

3. 進入你的目錄,跑專案

出現下面**  代表專案已經啟動起來

vue專案搭建

前提安裝好node不再贅述 可以在自帶的命令列中執行,也可以在webstome中執行 安裝cnpm npm install g cnpm registry 安裝webpack 這一步可以省略,反正你也不會用 cnpm install webpack g 全域性安裝 vuecnpm install g...

Vue專案搭建

vue cli 專案搭建及常用外掛程式安裝,報錯解決 環境搭建 node v 檢測版本 2.安裝webpack npm install webpack g webpack v 檢測是否安裝成功 專案搭建 1.npm install vue cli g vue v 接下來的步驟有兩種方式 1 cd 進...

vue專案搭建

1 安裝 映象,用cnpm裝東西很省事,目前沒被坑過 一下命令在cmd中完成 可以不按裝 npm install g cnpm registry 2 安裝vue腳手架 cnpm install g vue cli測試是否成功安裝 vue v 3.進入安裝的資料夾目錄,構建檔案結構目錄 vue ini...