第一步：你要有一個(gè)微信小程序，在微信開(kāi)發(fā)者平臺(tái)上

至于怎樣申請(qǐng)微信開(kāi)發(fā)者appid和微信開(kāi)發(fā)者平臺(tái)上面的東西可以自己去百度下，重點(diǎn)講的是在HBuilderX開(kāi)發(fā)小程序

第二步：在你的微信開(kāi)發(fā)者工具里面新建一個(gè)小程序

第三步：把你新建好的項(xiàng)目導(dǎo)入到HBuilderX里面去

然后點(diǎn)擊運(yùn)行--運(yùn)行到小程序模擬器，就可以自動(dòng)打開(kāi)微信開(kāi)發(fā)者工具，就可以實(shí)現(xiàn)在Hbuilder開(kāi)發(fā)，微信開(kāi)發(fā)者工具預(yù)覽。但是?。。∪绻磺姓５那闆r下是這樣的，如果不正常的話(huà)，那你將很難受，好在我已經(jīng)填了許多坑，我就把不正常的情況給大家說(shuō)下。

首先，如果你已經(jīng)導(dǎo)入了項(xiàng)目到hbuilderx里面，但是點(diǎn)擊運(yùn)行時(shí)，運(yùn)行到小程序那一行是不可點(diǎn)或者點(diǎn)了之后控制臺(tái)報(bào)不能連接到微信開(kāi)發(fā)者工具，這時(shí)候你就要打開(kāi)自己的微信開(kāi)發(fā)者工具了，如圖下操作

在微信開(kāi)發(fā)者工具的上方 點(diǎn)擊設(shè)置--安全設(shè)置

ok,這時(shí)候你就可以在hbuilderx開(kāi)發(fā)，微信開(kāi)發(fā)者工具里預(yù)覽了。但是如果你沒(méi)有申請(qǐng)到appid的話(huà)在微信開(kāi)發(fā)者里面只能pc端預(yù)覽，而不能手機(jī)掃碼預(yù)覽，因?yàn)樗鼤?huì)提示你本項(xiàng)目不是開(kāi)發(fā)者開(kāi)發(fā)。

還有一個(gè)問(wèn)題是引用vant庫(kù)時(shí)的報(bào)錯(cuò)

當(dāng)我按照所有流程來(lái)時(shí)

第一步：npm i vant-weapp -S --production

第二步：

第三步：就是在你的代碼里寫(xiě)下

<van-button type="primary">按鈕</van-button>

這時(shí)候你運(yùn)行的時(shí)候他就開(kāi)始調(diào)皮了

這個(gè)問(wèn)題我在度娘還愣是沒(méi)找到完全的解決方案

這時(shí)候就又要回到微信開(kāi)發(fā)者工具了 點(diǎn)擊設(shè)施--項(xiàng)目設(shè)置

然后再hbuilderx里面打開(kāi)該項(xiàng)目的命令行工具輸入以下命令

npm init
npm install --production vant-weapp

這時(shí)候你再回到hbuilderX里面你會(huì)發(fā)現(xiàn)多了一個(gè)文件

然后再在你要用到的文件json里面寫(xiě)下路徑

{
  "usingComponents": {
		 "van-button": "vant-weapp/button/index"
	}
}

到此這篇關(guān)于淺談HBuilderX開(kāi)發(fā)小程序的一些問(wèn)題的文章就介紹到這了,更多相關(guān)HBuilderX開(kāi)發(fā)小程序內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論