微信web開發(fā)者工具M(jìn)ac版是一款為蘋果用戶開發(fā)的小程序開發(fā)工具,用戶可以在這里進(jìn)行更方便、更安全地開發(fā)和調(diào)試基于微信的網(wǎng)頁,讓你快速制作一個自己的小程序。
軟件功能
1、使用自己的微信號來調(diào)試微信網(wǎng)頁授權(quán)
2、調(diào)試、檢驗頁面的 JS-SDK 相關(guān)功能與權(quán)限,模擬大部分 SDK 的輸入和輸出
3、使用基于 weinre 的移動調(diào)試功能
4、利用集成的 Chrome DevTools 協(xié)助開發(fā)
使用教程
啟動頁
登錄頁
在登錄頁,可以使用微信掃碼登陸開發(fā)者工具,開發(fā)者工具將使用這個微信帳號的信息進(jìn)行小程序的開發(fā)和調(diào)試。
模式選擇
開發(fā)者工具提供兩種開發(fā)模式的選擇。
公眾號網(wǎng)頁調(diào)試。選擇公眾號網(wǎng)頁調(diào)試,將直接進(jìn)入公眾號網(wǎng)頁項目調(diào)試界面,在地址欄輸入 URL,即可調(diào)試該網(wǎng)頁的微信授權(quán)以及微信 JS-SDK 功能。
小程序調(diào)試。選擇小程序調(diào)試,將進(jìn)入小程序本地項目管理頁,可以新建、刪除本地的項目,或者選擇進(jìn)入已存在的本地項目。
新建項目
當(dāng)符合以下條件時,可以在本地創(chuàng)建一個小程序項目
需要一個小程序的 AppID;如沒有 AppID,可以選擇申請使用測試號。
登錄的微信號需要是該 AppID 的開發(fā)者;
需要選擇一個空目錄,或者選擇的非空目錄下存在 app.json 或者 project.config.json。當(dāng)選擇空目錄時,可以選擇是否在該目錄下生成一個簡單的項目。
多開項目
工具支持同時打開多個項目,每次打開項目時會從新窗口打開,入口有以下幾種:
從項目選擇頁打開項目,處于項目窗口時可以從菜單欄的項目 -> 查看所有項目打開項目選擇頁
從菜單欄的最近打開項目列表中打開的項目會從新窗口打開
新建項目
命令行或 HTTP 調(diào)用工具打開項目
管理項目
對本地項目進(jìn)行刪除和批量刪除
主界面
開發(fā)者工具主界面,從上到下,從左到右,分別為:菜單欄、工具欄、模擬器、編輯器、調(diào)試器 五大部分。
菜單欄
微信web開發(fā)者工具
切換賬號:快速切換登錄用戶
關(guān)于:關(guān)于開發(fā)者工具
檢查更新:檢查版本更新
開發(fā)者論壇:前往開發(fā)者論壇
開發(fā)者文檔:前往開發(fā)者文檔
調(diào)試:調(diào)試開發(fā)者工具、調(diào)試編輯器;如果遇到疑似開發(fā)者工具或者編輯器的 bug,可以打開調(diào)試工具查看是否有出錯日志,歡迎在論壇上反饋相關(guān)問題
更換開發(fā)模式:快速切換公眾號網(wǎng)頁調(diào)試和小程序調(diào)試
退出:退出開發(fā)者工具
項目
新建項目:快速新建項目
打開最近:可以查看最近打開的項目列表,并選擇是否進(jìn)入對應(yīng)項目
查看所有項目:新窗口打開啟動頁的項目列表頁
關(guān)閉當(dāng)前項目:關(guān)閉當(dāng)前項目,回到啟動頁的項目列表頁
文件
新建文件
保存
保存所有
關(guān)閉文件
編輯:可以查看編輯相關(guān)的操作和快捷鍵
工具
編譯:編譯當(dāng)前小程序項目
刷新:與編譯的功能一致,由于歷史原因保留對應(yīng)的快捷鍵 ctrl(⌘) + R
編譯配置:可以選擇普通編譯或自定義編譯條件
前后臺切換:模擬客戶端小程序進(jìn)入后臺運(yùn)行和返回前臺的操作
清除緩存:清除文件緩存、數(shù)據(jù)緩存、以及授權(quán)數(shù)據(jù)
界面:控制主界面窗口模塊的顯示與隱藏
設(shè)置:
外觀設(shè)置:控制編輯器的配色主題、字體、字號、行距
編輯設(shè)置:控制文件保存的行為,編輯器的表現(xiàn)
代理設(shè)置:選擇直連網(wǎng)絡(luò)、系統(tǒng)代理和手動設(shè)置代理
通知設(shè)置:設(shè)置是否接受某種類型的通知
工具欄
點擊用戶頭像可以打開個人中心,在這里可以便捷的切換用戶和查看開發(fā)者工具收到的消息。
用戶頭像右側(cè)是控制主界面模塊顯示/隱藏的按鈕。至少需要有一個模塊顯示。
工具欄中間,可以選擇普通編譯,也可以新建并選擇自定義條件進(jìn)行編譯和預(yù)覽。
通過切后臺按鈕,可以模擬小程序進(jìn)入后臺的情況
工具欄上提供了清緩存的快速入口。可以便捷的清除工具上的文件緩存、數(shù)據(jù)緩存、還有后臺的授權(quán)數(shù)據(jù),方便開發(fā)者調(diào)試。
工具欄右側(cè)是開發(fā)輔助功能的區(qū)域,在這里可以上傳代碼、申請測試、上傳騰訊云、查看項目信息
工具欄管理
在工具欄上點擊鼠標(biāo)右鍵,可以打開工具欄管理
模擬器
模擬器可以模擬小程序在微信客戶端的表現(xiàn)。小程序的代碼通過編譯后可以在模擬器上直接運(yùn)行。
開發(fā)者可以選擇不同的設(shè)備,也可以添加自定義設(shè)備來調(diào)試小程序在不同尺寸機(jī)型上的適配問題。
在模擬器底部的狀態(tài)欄,可以直觀地看到當(dāng)前運(yùn)行小程序的場景值,頁面路徑及頁面參數(shù)
獨(dú)立窗口
點擊 模擬器/調(diào)試器 右上角的按鈕可以使用獨(dú)立窗口顯示 模擬器/調(diào)試器