通過本節(jié)，你將學(xué)會：

• web 預(yù)覽項目
• 掃碼與快速調(diào)試

web預(yù)覽快應(yīng)用項目

用戶不需要等待生成 rpk 并安裝在手機(jī)上即可預(yù)覽項目效果

打開項目

創(chuàng)建工程之后，快應(yīng)用開發(fā)工具將自動打開新建的快應(yīng)用工程，或者打開其他快應(yīng)用項目。

打開 web 預(yù)覽功能

點擊開發(fā)工具頂部工具欄的模擬器，即可打開或者關(guān)閉 web 預(yù)覽功能，如下圖：

使用 web 預(yù)覽功能

• 用戶可以通過頂部工具欄上的按鈕開啟/關(guān)閉 web 預(yù)覽窗口和 web 預(yù)覽開發(fā)者工具窗口
• 調(diào)試器定制的 UX 面板，展示預(yù)覽的 Dom 結(jié)構(gòu)以及樣式，可實時修改樣式規(guī)則、命名以及元素屬性。
• 調(diào)試器定制的 Data 面板，展示頁面數(shù)據(jù)，主要指 .ux 文件中的 private、protected 字段，并支持自動刷新。
• 右上角的后退，刷新可以幫助開發(fā)者調(diào)試項目
• 展示二維碼可以在手機(jī)上用調(diào)試器掃碼直接安裝項目，詳情請見快速調(diào)試中 掃碼調(diào)試
• 預(yù)覽設(shè)置中，可關(guān)閉或開啟保存文件時自動刷新、重新啟動編譯。

掃碼與快速調(diào)試

了解通過兩種方式來調(diào)試快應(yīng)用

掃碼調(diào)試

掃碼調(diào)試項目可以通過掃二維碼預(yù)覽安裝至手機(jī)的 rpk

用快應(yīng)用開發(fā)工具打開一個快應(yīng)用工程

• 此時開發(fā)工具將會自動對項目進(jìn)行編譯并生成 rpk 文件。

在手機(jī)調(diào)試器中"關(guān)閉"【開啟usb調(diào)試】功能

• 此時在“開啟 usb 調(diào)試”下面會出現(xiàn)”掃碼安裝“功能。

注意：

• 如果手機(jī)沒有安裝調(diào)試器的話可以通過開發(fā)工具自帶的 更新手機(jī)環(huán)境 功能安裝調(diào)試器。

點擊開發(fā)工具右上角的顯示二維碼按鈕并進(jìn)行掃碼

• 掃碼成功后，此時手機(jī)與開發(fā)工具將建立連接，手機(jī)調(diào)試器將自動打開安裝的 rpk 效果。

掃碼安裝成功后，在手機(jī)調(diào)試器右下角可以選擇“開始調(diào)試”進(jìn)行調(diào)試

注意：

• 手機(jī)調(diào)試器掃過一次二維碼后將和開發(fā)工具建立連接，之后只需要使用“開始調(diào)試”進(jìn)行調(diào)試。

快速調(diào)試

快速調(diào)試項目可以預(yù)覽安裝至手機(jī)的 rpk

通過本節(jié)，你將學(xué)會：

• 利用開發(fā)工具快速調(diào)試一個項目

開啟 usb 調(diào)試

• 詳情可以參考 其他功能 中的 開啟 usb 調(diào)試。

開始調(diào)試

• 手機(jī)跟電腦需要處于同一局域網(wǎng)內(nèi)。如果不能保證在同一個局域網(wǎng)內(nèi)，可在安裝完【快應(yīng)用調(diào)試器】后，打開【快應(yīng)用調(diào)試器】，在首頁點擊打開【開啟 USB 調(diào)試】模式開關(guān)。如下圖所示：                   

注意：

• 如果手機(jī)沒有安裝調(diào)試器的話可以通過開發(fā)工具自帶的 更新手機(jī)環(huán)境 功能安裝調(diào)試器。
• 點擊工具欄的 USB 調(diào)試，即可執(zhí)行快速進(jìn)行 USB 調(diào)試，如下圖所示：
  
• 每次運行調(diào)試時，開發(fā)者工具會檢測您的手機(jī)是否安裝了【快應(yīng)用預(yù)覽版】【快應(yīng)用調(diào)試器】。如果未安裝，開發(fā)者工具將自動安裝。

• 快應(yīng)用預(yù)覽版首次打開會提示用戶授理存儲權(quán)限，同樣調(diào)試器在運行過程中也會提示授理存儲權(quán)限，為了確保正常開啟調(diào)試請點擊允許。如下圖所示：
  
• 以上授權(quán)成功后，需要重新運行調(diào)試才能進(jìn)入正常的調(diào)試流程。

調(diào)試預(yù)覽：

• 調(diào)試運行成功后，電腦端會打開調(diào)試頁面。如下圖所示