VUE,基於vue cli搭建建立vue專案

2022-05-28 17:15:10 字數 1689 閱讀 5630

前提然後安裝vue-cli 安裝方式:cmd命令列安裝:開啟cmd命令符輸入進行全域性安裝腳手架:npm install -g @vue/cli

全域性腳手架安裝成功之後就可以建立vue專案了

三種建立方式:這裡演示第三種

第一種(舊版本建立專案,不推薦):首先要安裝依賴包npm install -g @vue/cli-init然後命令列輸入:vue init webpack my-project

開始建立專案

第二種(新版本視覺化建立專案,推薦)

:通過命令列輸入:vue ui

進行視覺化建立

第三種(新版本命令列建立專案)

:通過命令列輸入:vue create

my-project開始建立vue專案

步驟一:選擇安裝方式:第一種自動安裝;第二種手動安裝建議手動安裝選擇自己需要的包。

步驟二:選擇需要的包進行安裝,空格選擇,回車確定。這裡選擇常用的三個包

步驟三: 提示是否選擇歷史模式的路由,這裡選n,雜湊模式

步驟四:選擇eslint版本,這裡用常規模式:standard config

步驟五:語法檢查方式,選擇第乙個:儲存就檢查

步驟六:選擇babel、eslint檔案存放,是單獨存放還是存放在一起,這裡選第乙個單獨存放,單獨存放便於後期維護

步驟七:提示是否記錄此次配置,記錄此次配置再次建立專案時可以引用同樣的配置,這裡隨意

回車等待建立完成

然後測試

首先進入建立的專案:cd my-porject

然後進入專案跑起來~~~npm run serve

專案成功跑起來之後會有乙個雜湊位址

複製位址到網頁開啟,出現下圖說明專案成功建立完成!

搭建Vue腳手架 vue cli 並建立Vue專案

1.安裝node.js vue的腳手架是依賴於node.js的,如果沒有安裝過node的話需要先到node.js官網上進行安裝。安裝完成後,開啟cmd視窗,輸入 node v 和 npm v 來檢視node.js和npm的版本,如果能夠顯示出版本,說明已經安裝成功。2.安裝 映象 cnpm 所以為了...

vue cli 搭建vue專案

安裝完成後,開啟命令列工具輸入命令node v,如果出現對應版本號,就說明安裝成功了。npm包管理器,是整合在node中的,所以,直接輸入npm v也會顯示出npm的版本資訊。由於npm的有些資源被牆,為了更快更穩定,所以我們需要切換到 的npm映象 cnpm。npm install g cnpm ...

vue cli搭建vue專案

生成依賴 命令 npm install 4.執行命令 npm run dev 5專案打包命令 npm run build 檢測node版本 node v 檢視npm安裝 npm v 解除安裝vue cli2 npm uninstall vue cli g 安裝vue cli3 npm install...