微信Web開發者工具-下載、安裝和使用圖解


開發和測試小程序,需要借助微信官方提供的微信Web開發者工具進行預覽和調試代碼,從下載安裝到使用,大致的流程如下:

1.下載安裝包

下載地址傳送門:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
根據所需的操作系統版本進行下載即可

 
 

2.安裝微信Web開發者工具

下載后的安裝包,wechat_devtools,接近80M大小

 
具體的安裝過程略過,Next Step即可

3.申請小程序管理員賬號,獲取開發者AppID

申請賬號:可參考 https://developers.weixin.qq.com/miniprogram/dev/
獲取AppID:小程序管理平台-->開發者設置-->開發者ID
該AppID將在微信Web開發者工具打開小程序項目時進行身份驗證用到

4.小程序管理員授權測試用的微信賬號

項目團隊中的不止一個人開發小程序時,如多個開發和測試成員,管理員可在小程序管理后台添加成員,並設置所需的權限
管理入口:小程序管理后台-->用戶身份-->成員管理
具體可參考 https://developers.weixin.qq.com/miniprogram/dev/quickstart/basic/role.html#%E7%94%A8%E6%88%B7%E8%BA%AB%E4%BB%BD

 

5.通過已授權的微信掃描登錄開發者工具

首次打開微信Web開發者工具,彈出二維碼提示框,用以上授權過的微信進行掃描:


 

掃描之后,手機微信端需要確認登錄:

 

6.新建並導入項目(項目路徑+項目名稱+AppID)

根據開發和測試的具體需要,點擊【小程序項目】

 
點擊管理項目右下角的“+”符號
 

導入小程序程序包的目錄路徑,填寫AppID(若程序包中有相關設置,此ID也可在導入程序目錄后自動填充)、項目名稱,然后點擊【確定】
 

7.預覽和調試小程序

微信Web開發者工具預覽小程序和調試代碼


 

除了在微信Web開發者工具可以使用預覽外,在其前已授權的手機微信端也可實現預覽效果
具體操作:點擊微信Web開發者工具右上角的【預覽】,工具提示“正在編譯JS文件”,稍等一會兒就可編譯完成並展示出二維碼,此時用已授權的微信掃描此二維碼(每次編譯的二維碼有效期大概20多min),即可在手機端微信上預覽小程序的實際效果


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM