在實(shí)際開發(fā)中，我們知道Hbuilder寫代碼和調(diào)試非常麻煩，換到我們的vscode，快捷鍵那些，界面插件調(diào)試，那叫一個(gè)舒服

輸入這個(gè)

1、全局安裝vue腳手架 

   npm install @vue/cli -g 

2.查看node-v版本號(hào)，我的是16，就沒啥問題

3.輸入這個(gè)命令

vue create -p dcloudio/uni-preset-vue my-project

如果不連連接也很正常，因?yàn)闆]有科學(xué)上網(wǎng)，所以自己去github官網(wǎng)下個(gè)模板就行了

教大家一種簡(jiǎn)單的方法

如果是創(chuàng)建vue3.0 + vite + javascript的uni-app項(xiàng)目，直接在瀏覽器打開 https://github.com/dcloudio/uni-preset-vue 切換到vite分支下載zip后綴的壓縮文件，解壓到本地就可以了。

2、如果是創(chuàng)建vue3.0 + vite + typescript的uni-app項(xiàng)目，直接在瀏覽器打開 https://github.com/dcloudio/uni-preset-vue 切換到vite-ts分支下載zip后綴的壓縮文件，解壓到本地就可以了。

我選擇了 這個(gè)

3、如果是創(chuàng)建vue2.0 + javascript的uniapp項(xiàng)目報(bào)錯(cuò)，解決辦法費(fèi)勁些：

直接在瀏覽器打開 https://github.com/dcloudio/uni-preset-vue，在master分支下載zip后綴的壓縮文件，解壓到本地。
通過命令行安裝, -p后面是解壓后的項(xiàng)目創(chuàng)建包的路徑，記得路徑中用/，而不是\。

vue create -p D:/uni-preset-vue-master my-vue2-project

不能上gitub的小伙伴，到我的國(guó)內(nèi)gitee的網(wǎng)址下載一樣滴?。?！

https://gitee.com/chen-zhengsheng/uniapp-vscode-vue3-ts-template?_from=gitee_search

然后按照提示選擇選擇執(zhí)行即可

現(xiàn)在2023年了，建議都用vue3+ts+vite，那寫起來是真的爽！?。?/p>

網(wǎng)頁(yè)運(yùn)行

npm run dev:h5

微信小程序運(yùn)行

npm run dev:mp-weixin

此時(shí)會(huì)生成一個(gè)dist文件

 選擇就可以

 名字換一個(gè)，然后appID用之前的就可以

 這個(gè)我的代碼就能在網(wǎng)頁(yè)和微信小程序同時(shí)運(yùn)行啦，實(shí)時(shí)保存熱更新！

萬(wàn)事開頭難，創(chuàng)建成項(xiàng)目就成功了一半

總結(jié)

到此這篇關(guān)于vscode中開發(fā)運(yùn)行uniapp項(xiàng)目的文章就介紹到這了,更多相關(guān)vscode開發(fā)運(yùn)行uniapp項(xiàng)目?jī)?nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論