8357
uni-app開發(fā)小程序的已經(jīng)很普遍了，當(dāng)然肯定有很多人已經(jīng)發(fā)過環(huán)境搭建這些，我這邊只是記錄我搭建的時候遇到的問題記錄一下，防止之后自己忘記咯，有問題可以指出就行
一 軟件部分
首先我們需要用到兩個東西 一個是微信開發(fā)者工具 ，一個是 HBuilder X，這兩個東西，微信開發(fā)者工具主要實現(xiàn)的編譯運行部分，代碼部分需要在 HBuilder X里面進行編寫和修改，當(dāng)然用 HBuilder X 內(nèi)置的web也可以運行起來
1. 微信開發(fā)者工具
選擇自己需要安裝到的路徑上就行了
微信開發(fā)者工具https://developers.weixin.qq.com/miniprogram/dev/devtools/nightly.html
安裝好以后
2. HBuilder X 開發(fā)工具
XHbuilder Xhttps://www.dcloud.io/hbuilderx.html
把壓縮包解壓即可使用
打開之后界面如下
二 配置部分
注：這邊建議把? Node.js 環(huán)境加上哦
提供一個安裝教程查看
Vue開發(fā) -- Node.js環(huán)境配置以及項目運行（圖文講解）文章瀏覽閱讀1.8k次，點贊23次，收藏25次。寫項目需要使用到Vue開發(fā)，恰好重新?lián)Q電腦了，也就記錄一下安裝以及配置過程，記錄一下遇到的問題和解決方法，方便以后看和參考。_node 項目運行https://herui.blog.csdn.net/article/details/135671505
1. 關(guān)于 HBuilder X 配置
打開設(shè)置
?選擇運行配置部分 找到微信開發(fā)者路徑 把我們安裝的微信開發(fā)者工具安裝路徑放進去
?還是運行配置部分 找到 node 路徑 把我們安裝的 node放進去
2. 關(guān)于 微信開發(fā)工具 配置
首先點擊 開發(fā)者工具的 右上角 進去設(shè)置
?點擊 安全 選項 并把服務(wù)端口 打開
三 運行項目
1. 新建項目
首先在 HBuilder X 里面新建一個 Vue2 的項目
一定要選擇 Vue2 不然運行不了微信小程序
2. 代碼編寫
軟件會讓我們自己建立項目，我們就可以在 index.vue 里面進行我們代碼編寫了
開發(fā)過web的小伙伴 入門這個應(yīng)該很快
3. 內(nèi)置瀏覽器 編譯
我們直接點擊右上 編譯 一下看一下代碼這些是否有錯 ，沒有就是會顯示我們自己建立的模板
4. 配置小程序
首先我們需要進行一些配置
如果我們是導(dǎo)入的別人的項目，我們需要重新獲取一下 uni-app 的 id
如果自己建立的項目可以不管這部分
找到微信小程序配置
我們需要 微信小程序的 AppID 查看下面這篇文章 然后獲取一些
AppID獲取
微信小程序注冊流程及APPID獲?。ㄍ暾鎴D文教程）文章瀏覽閱讀5.1w次，點贊83次，收藏210次。本文將圖文介紹微信小程序注冊、完善小程序賬號信息、添加項目成員和體驗成員和獲取小程序ID（AppID）及小程序密鑰（AppSecret）的詳細(xì)流程，旨在提供簡明的入門指導(dǎo)和實踐建議。微信小程序提供了一個簡單而直接的方式，讓開發(fā)者能夠快速開始他們的小程序開發(fā)旅程。開發(fā)者需要訪問微信公眾平臺的官方網(wǎng)站，并選擇“小程序”作為注冊類型。這個過程中，你會被要求提供一些基本信息，包括但不限于你的個人或企業(yè)信息。值得注意的是，根據(jù)你的開發(fā)目的選擇正確的賬號類型非常重要，因為它會影響到你可以使用的微信小程序功能和權(quán)限。_微信小程序appidhttps://blog.csdn.net/Captinyoo/article/details/136433186
注意
這個ID 和我們登錄的微信開發(fā)者工具登錄的微信需要關(guān)聯(lián) 否則運行不了
如果我們需要運行別人的小程序 ，也需要修改這個部分
?四 實現(xiàn)效果
做完上面之后，我們只需要點擊 上面的運行 選擇 微信開發(fā)者工具 就可以自動編譯運行了
?軟件會自動啟動 選擇信任運行
運行效果
修改代碼 在HBuilder X里面修改了代碼之后
按 Ctrl + S 即可以自動運行編譯
聯(lián)系方式 微信號：13648103287
