字節(jié)跳動開發(fā)者工具是面向小程序開發(fā)者推出的 PC 端開發(fā)者工具，字節(jié)跳動開發(fā)者工具支持小程序開發(fā)、調(diào)試、預覽、上傳等基本功能，并且集成開發(fā)者服務（包含智能客服等），支持在 Windows、Mac 多平臺上運行，核心目標是為了幫助開發(fā)者更高效地開發(fā)小程序。

使用方法

　　新建項目

　　當滿足：

　　已擁有一個字節(jié)跳動小程序的 AppID；

　　所登錄的賬號是該 AppID 所對應小程序的開發(fā)者。

　　可以選擇窗口中央的「創(chuàng)建一個頭條小程序」，或點擊右下角的「新建」按鈕，新建工程。

　　選擇項目類型：小程序或小游戲（一旦選擇無法更改）。

　　選擇一個空目錄，作為工程目錄。當選擇空目錄時，可以選擇是否在該目錄下生成一個簡單的項目。

　　appId 需要在公眾平臺管理后臺獲取。

　　主界面

　　圖中所示分別為：工具欄、模擬器、編輯器、調(diào)試器四大部分。

　　窗口菜單欄

　　小程序：可以查看開發(fā)者工具版本號

　　項目：支持打開「開發(fā)者工具」本身的調(diào)試器

　　編輯：可以查看編輯相關(guān)的操作和快捷鍵

　　工具欄

　　編譯：編譯當前的小程序項目

　　刷新頁面：刷新當前頁面

　　清除緩存：可以清除文件緩存、數(shù)據(jù)緩存、登錄狀態(tài)和授權(quán)數(shù)據(jù)

　　上傳：填入 app 版本號及更新日志，上傳小程序應用內(nèi)容到服務器

　　預覽：生成二維碼，預覽已上傳版本

　　詳情：展示當前小程序的 appid、user_id、本地目錄、文件系統(tǒng)、基礎(chǔ)版本與編譯版本，并可以設(shè)置校驗 TLS 版本以及 HTTPS 證書

　　點擊「模擬器」、「編輯器」、「調(diào)試器」三個按鈕可以隱藏/顯示相應的模塊，界面中至少有一個模塊被顯示。

　　模擬器

　　模擬器模擬頭條小程序在客戶端真實的邏輯表現(xiàn)，對于絕大部分的 API 均能夠在模擬器上呈現(xiàn)出正確的狀態(tài)。開發(fā)者可以選擇不同的設(shè)備，調(diào)試小程序在不同尺寸機型上的適配問題。

　　編輯器

　　編輯器模塊內(nèi)可以對當前項目進行代碼編寫和文件的添加、刪除以及重命名等基本操作。

　　文件格式：因 iOS 下僅支持 UTF8 編碼格式，最新版本的開發(fā)者工具會在上傳代碼時候?qū)Υa文件做一次編碼格式校驗。

　　文件支持：工具目前提供了 5 種文件的編輯：ttml、ttss、js、json 以及圖片文件的預覽。

　　文件操作：可以通過在目錄樹上右鍵，選擇新建 Page，將自動生成頁面所需要的 ttml、ttss、js、json，及在 app.json 的 pages 字段，添加需要新建的頁面的路徑，將會自動生成該頁面所需要的文件，兩種方式新建頁面。

　　目錄樹：可以查看當前項目的目錄結(jié)構(gòu)。

　　調(diào)試器

　　調(diào)試工具分為 6 大功能模塊：Bxml、Console、Sources、Network、Application、Performance

　　自定義編譯條件

　　編譯條件會讀取 project.config.json 中的 condition 字段下的相關(guān)配置，方便導入編譯條件。

　　點擊工具欄的普通編譯處，在下拉列表中，點擊添加編譯模式，會彈出填寫編譯條件窗口，添加自己的定制化的編譯條件。

　　在彈出的窗口中，添加模式名稱，啟動頁面，啟動參數(shù)以及進入場景幾個字段，點擊確認，生成新的編譯條件。

　　上傳提審

　　點擊工具欄的"上傳"按鈕，填寫版本號（版本號不能重復，需在上一個版本號上加 1）, 填寫更新日志，點擊確認上傳至開發(fā)者平臺。

　　上傳完成后，進入開發(fā)者平臺=》發(fā)布頁面進行提審

　　Bxml panel

　　Bxml panel 用于幫助開發(fā)者開發(fā) ttml 轉(zhuǎn)化后的界面。在這里可以看到真實的頁面結(jié)構(gòu)以及結(jié)構(gòu)對應的 ttss 屬性，同時可以通過修改對應 ttss 屬性，在模擬器中實時看到修改的情況（僅為實時預覽，無法保存到文件）。通過調(diào)試模塊左上角的選擇器，還可以快速定位頁面中組件對應的 ttml 代碼。

　　Console panel

　　開發(fā)者可以在此調(diào)試代碼。

　　Sources panel

　　Sources panel 用于顯示當前項目的腳本文件，同瀏覽器開發(fā)不同，小程序框架會對腳本文件進行編譯的工作，所以在 Sources panel 中開發(fā)者看到的文件是經(jīng)過處理之后的腳本文件，開發(fā)者的代碼都會被包裹在 define 函數(shù)中，并且對于 Page 代碼，在尾部會有 require 的主動調(diào)用。

　　Network panel

　　Network Panel 用于觀察和顯示 request 和 socket 的請求情況。

　　AppData panel

　　AppData panel 用于展示以及修改當前 page 的 data 屬性

　　Storage panel

　　可以查看 Storage 存儲情況。

常見問題

　　解決字節(jié)跳動開發(fā)者工具安裝無法打開問題

　　下載字節(jié)跳動開發(fā)者工具 下載之后 點擊安裝 默認安裝到

　　C:\Users\你的電腦名稱\AppData\Local\Programs\bytedanceide

　　目錄下 但是點擊打開 彈窗報紅色錯誤如下圖：

　　解決方法：

　　C:\Users\你的電腦名稱\AppData\Roaming 目錄下新建 bytedanceide 文件夾

　　然后 bytedanceide 文件夾下面新建 tmadevtool 文件夾

　　然后 tmadevtool 文件夾下面新建一個名為 projectInfo 的無后綴的文件

　　就這么輕松解決啦

　　重新打開字節(jié)跳動開發(fā)者工具 一切正常?。?！