一、環(huán)境安裝與檢查
- 首先，我們要確保我們安裝了構(gòu)建vue框架的環(huán)境，不會(huì)安裝的請(qǐng)自行百度，有很多安裝教程。
- 檢查環(huán)境
-
node -v # 如果沒有安裝nodejs請(qǐng)安裝，安裝教程自行百度vue -V # 沒有安裝，請(qǐng)執(zhí)行 npm install -g @vue/cli
?這些環(huán)境都安裝了之后就可以進(jìn)行vue項(xiàng)目的搭建了。
二、vue項(xiàng)目搭建
- ?進(jìn)入你要?jiǎng)?chuàng)建vue項(xiàng)目的目錄下進(jìn)行項(xiàng)目創(chuàng)建，輸入：vue create “項(xiàng)目名稱”， 例：
-
vue create project-app
選擇 Manually select? features? 選項(xiàng)，進(jìn)行自行配置
-
-
?選擇完這幾個(gè)之后回車
-
選擇 版本 3.x
-
? ? ? ?第一個(gè)選項(xiàng)選擇N，不要history mode for router，之后的選項(xiàng)都默認(rèn)選擇第一個(gè)，直接按回車鍵，直到來到這里選擇是否記住上述的配置項(xiàng)，下次創(chuàng)建vue項(xiàng)目時(shí)還是按這種配置創(chuàng)建，這里我們選擇N；
?
?選擇N之后，我們只要等待項(xiàng)目創(chuàng)建完成即可；下圖表明已經(jīng)創(chuàng)建完成。
三、編輯項(xiàng)目
我用的是VScode編輯器打開，可以看看項(xiàng)目文件的結(jié)構(gòu)
在當(dāng)前目錄下啟動(dòng)項(xiàng)目：npm? run? serve
?瀏覽器訪問：http://127.0.0.1:8080
?為了不會(huì)因?yàn)楦袷降葐栴}而報(bào)錯(cuò)，我們需要在 vue.config.js? 中添加??? lintOnSave: false? ，之后重新執(zhí)行：npm? run? serve? 重啟項(xiàng)目，這樣就不會(huì)出現(xiàn)格式問題的報(bào)錯(cuò)。
文章來源：http://www.zghlxwxcb.cn/news/detail-656331.html
?好了，vue3.X項(xiàng)目的創(chuàng)建就結(jié)束了。文章來源地址http://www.zghlxwxcb.cn/news/detail-656331.html
到了這里，關(guān)于Vue3.X 創(chuàng)建簡單項(xiàng)目的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
