長(zhǎng)沙小程序開發(fā)：學(xué)習(xí)微信小程序真機(jī)調(diào)試！學(xué)習(xí)微信小程序真機(jī)調(diào)試，前面幾期給大家介紹的學(xué)習(xí)微信小程序開發(fā)的是由淺入深階段式的介紹，今天長(zhǎng)沙小程序開發(fā)智企云又帶來的是小程序真機(jī)調(diào)試干貨內(nèi)容介紹，程序調(diào)試是整個(gè)項(xiàng)目開發(fā)中將近尾端的介紹，要在真機(jī)中反復(fù)調(diào)試，測(cè)試出看有沒有相應(yīng)的BUG,進(jìn)行代碼修復(fù)，具體的相關(guān)內(nèi)容，請(qǐng)看以下：

　　(如果你是游客模式將無法使用工具欄中的“真機(jī)調(diào)試功能”，本章節(jié)我們默認(rèn)不是游客模式，下面將講解真機(jī)調(diào)試過程。)

　　1、發(fā)起一個(gè)真機(jī)遠(yuǎn)程調(diào)試流程，需要先點(diǎn)擊開發(fā)者工具的工具欄上 “真機(jī)調(diào)試” 按鈕。此時(shí)，工具會(huì)將本地代碼進(jìn)行處理打包并上傳，就緒之后，使用手機(jī)客戶端掃描二維碼即可彈出調(diào)試窗口，開始遠(yuǎn)程調(diào)試。

　　2、使用手機(jī)掃描此二維碼，即可開始遠(yuǎn)程調(diào)試。要結(jié)束調(diào)試，直接關(guān)閉此調(diào)試窗口，或點(diǎn)擊右下角 “結(jié)束調(diào)試” 按鈕即可。

　　遠(yuǎn)程調(diào)試窗口分為兩部分，分別是左側(cè)的調(diào)試器視圖、右側(cè)的信息視圖。開發(fā)者可以在調(diào)試器里直接進(jìn)行代碼的調(diào)試，并查看 Storage(上邊有講) 情況;信息視圖則可以查看目前與手機(jī)和服務(wù)器的連接情況，以及發(fā)生的錯(cuò)誤信息等。

　　3、在遠(yuǎn)程調(diào)試的調(diào)試器里，開發(fā)者可以在 Console 面板里對(duì)代碼進(jìn)行調(diào)試，在 Sources 面板里查看小程序的源代碼并進(jìn)行斷點(diǎn)單步調(diào)試，在 Storage 面板里查看小程序的 Storage 使用情況等。

　　注意，要在 Console 里對(duì)小程序進(jìn)行調(diào)試，需要將調(diào)試的上下文切換到 VM Context 1，如圖所示。

        WXML、AppData、Storage 面板的操作和開發(fā)者工具調(diào)試模擬器時(shí)的操作一致。注意，如果在右側(cè)信息視圖取消勾選了 “使用工具端的 Storage”，則所有的 Storage 數(shù)據(jù)將被存儲(chǔ)在手機(jī)上，將不再出現(xiàn) Storage 面板。

　　4、下圖展示了手機(jī)、網(wǎng)絡(luò)連接的信息。除此之外還包括手機(jī)的型號(hào)、系統(tǒng)、名稱、微信版本等信息，以及通信延時(shí)。通信延時(shí)越小，與手機(jī)的通信越流暢。

　　在 “連接信息” 里，展示了工具與服務(wù)器的連接信息，包括了連接狀態(tài)、服務(wù)器狀態(tài)等，當(dāng)連接故障、服務(wù)器阻塞影響到調(diào)試的過程和流暢度時(shí)，此處將展示這一狀態(tài)。當(dāng)連接狀態(tài)為 “已結(jié)束” 時(shí)，表明調(diào)試已被終止。

　　“警告和錯(cuò)誤” 展示了最近發(fā)生的錯(cuò)誤和警告信息。如果網(wǎng)絡(luò)連接斷開，此處將會(huì)詢問開發(fā)者是否需要重新連接。

       5、手機(jī)端調(diào)試

　　調(diào)試過程中的手機(jī)端展示如下所示。當(dāng)手機(jī)無網(wǎng)絡(luò)或者進(jìn)入了斷點(diǎn)狀態(tài)時(shí)，將會(huì)出現(xiàn)一個(gè)浮層提示并阻止進(jìn)一步的操作。

       6、小游戲遠(yuǎn)程調(diào)試

　　如果讀者是開發(fā)小游戲的，那么與小程序稍微有些不同，在調(diào)試窗口的右側(cè)可能會(huì)出現(xiàn) “Contexts” 欄，可以點(diǎn)選希望調(diào)試的不同的 JavaScript 上下文。默認(rèn)情況下，為了方便調(diào)試，工具會(huì)上傳帶有完整源代碼的 Source Map。如果不希望上傳，或者出現(xiàn)代碼行列數(shù)映射錯(cuò)亂的情況，可以在右下側(cè)選項(xiàng)中關(guān)閉這個(gè)選項(xiàng)，并取消勾選項(xiàng)目詳情中的 “上傳代碼時(shí)自動(dòng)壓縮混淆” 選項(xiàng)。

　　    以上就是長(zhǎng)沙小程序開發(fā)帶來的學(xué)習(xí)微信小程序真機(jī)調(diào)試相關(guān)內(nèi)容介紹，(以上內(nèi)容就是對(duì)小程序開發(fā)者工具的詳細(xì)講解，讀者可以用它上手自己的小程序開發(fā)了，建議讀者可以再看看“官方文檔”-->“教你設(shè)計(jì)優(yōu)質(zhì)程序”，學(xué)習(xí)一下小程序的整體設(shè)計(jì)思路，畢竟開發(fā)人員在敲代碼之前是需要和產(chǎn)品經(jīng)理深入溝通才行。)在此長(zhǎng)沙小程序開發(fā)公司智企云為各大眾們提供專業(yè)的行業(yè)解決方案，若你的企業(yè)有小程序開發(fā)方面的需求，不妨與我們?nèi)〉寐?lián)系！