1.2 uni-app開發環境搭建

搭建開發環境是使用uni-app的基礎，下面介紹uni-app的開發工具和微信小程序開發環境的搭建。

1.2.1 uni-app開發工具簡介

在uni-app的日常開發中，使用得比較多的是HBuilderX編輯器。“HBuilderX”中，H是HTML（Hyper Text Markup Language，超文本標記語言），Builder是構造者，X是HBuilder的下一代版本，簡稱HX。 HX是為前端開發者服務的通用IDE，或稱為編輯器，與VSCode、Sublime、WebStorm等編輯器類似，可以開發普通Web項目，也可以開發DCloud推出的uni-app項目、5+App項目、wap2app項目。除了支持前端技術棧，HBuilderX也可以借助插件支持PHP等其他語言。

HBuilderX編輯器相比其他編輯器具有以下優勢。

（1）輕巧、極速：HBuilderX綠色發行包只有10MB。不管是啟動、打開大文檔，還是編碼提示，都能極速響應。采用C++的架構，性能遠超Java或Electron架構。

（2）強大的語法提示：HBuilderX具有優秀的AST（Abstract Syntax Tree，抽象語法樹）語法分析能力，其語法提示精準、全面、細致。

（3）專為Vue打造：提供比其他工具更優秀的Vue支持，大幅提升Vue開發效率。

（4）清爽護眼：界面清爽簡潔，綠柔主題適合人眼長期觀看。

（5）高效極客操作：HBuilderX對字處理提供了強大的支持，多光標、智能雙擊、選區管理等讓文字處理的效率大幅提升。

（6）markdown優先：HBuilderX是唯一一個新建文件默認類型是markdown的編輯器，也是對MD書寫支持最強的編輯器，甚至可以直接粘貼表格、圖片。

（7）小程序支持：國外的開發工具沒有對中國的小程序開發進行優化，HBuilderX可以新建小程序項目，為國人提供更高效的工具。

（8）拓展性強：HBuilderX支持Java插件、Node.js插件，并兼容很多VSCode插件及代碼塊；還可以通過外部命令方便地調用各種命令行功能，并設置快捷鍵。如果想要使用其他工具（如VSCode或Sublime）的快捷鍵，可以在【工具】→【預設快捷鍵方案切換】菜單中進行切換。

1.2.2 小程序開發環境搭建

要開發小程序，首先需要擁有一個小程序賬號，通過該賬號管理小程序。下面以微信小程序為例進行介紹。

步驟01 申請一個小程序賬號。

訪問微信公眾平臺官網，進入小程序注冊頁面，根據指引填寫信息并提交相應的資料，即可擁有自己的小程序賬號，如圖1-5所示。

通過該小程序管理平臺，可以管理小程序的權限、查看數據報表、發布小程序等。

步驟02 登錄小程序后臺，選擇【開發】→【開發設置】選項，即可看到小程序的AppID，如圖1-6所示。

溫馨提示

小程序的AppID相當于小程序的身份證，后續會在很多地方用到AppID。

步驟03 有了小程序賬號之后，還需要一個工具來開發小程序。前往微信開發者工具下載頁面，根據操作系統下載相應的安裝包進行安裝。有關開發者工具更詳細的介紹，讀者可以查看微信小程序官方提供的《開發者工具介紹》。

步驟04 打開小程序開發者工具，用微信掃碼登錄，準備開發你的第一個小程序吧！