小程序開發的(de)JSON 配置介紹

作者：龍 時(shí)間：2018-07-27 浏覽：

小程序開發的(de)JSON 配置介紹

|我們可(kě)以看到在項目的(de)根目錄有一個(gè) app.json 和(hé) project.config.json，此外在 pages/logs 目錄下(xià)還(hái)有一個(gè) logs.json，我們依次來(lái)說明(míng)一下(xià)他(tā)們的(de)用(yòng)途。

小程序配置 app.json

app.json 是對(duì)當前小程序的(de)全局配置，包括了(le)小程序的(de)所有頁面路徑、界面表現、網絡超時(shí)時(shí)間、底部 tab 等。QuickStart 項目裏邊的(de) app.json 配置内容如下(xià)：

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black"
  }
}

我們簡單說一下(xià)這(zhè)個(gè)配置各個(gè)項的(de)含義:

1. pages字段 —— 用(yòng)于描述當前小程序所有頁面路徑，這(zhè)是爲了(le)讓微信客戶端知道當前你的(de)小程序頁面定義在哪個(gè)目錄。
2. window字段 —— 小程序所有頁面的(de)頂部背景顔色，文字顔色定義在這(zhè)裏的(de)。

其他(tā)配置項細節可(kě)以參考文檔 小程序的(de)配置 app.json 。

工具配置 project.config.json

通(tōng)常大(dà)家在使用(yòng)一個(gè)工具的(de)時(shí)候，都會針對(duì)各自喜好做(zuò)一些個(gè)性化(huà)配置，例如界面顔色、編譯配置等等，當你換了(le)另外一台電腦(nǎo)重新安裝工具的(de)時(shí)候，你還(hái)要重新配置。

考慮到這(zhè)點，小程序開發者工具在每個(gè)項目的(de)根目錄都會生成一個(gè) project.config.json，你在工具上做(zuò)的(de)任何配置都會寫入到這(zhè)個(gè)文件，當你重新安裝工具或者換電腦(nǎo)工作時(shí)，你隻要載入同一個(gè)項目的(de)代碼包，開發者工具就自動會幫你恢複到當時(shí)你開發項目時(shí)的(de)個(gè)性化(huà)配置，其中會包括編輯器的(de)顔色、代碼上傳時(shí)自動壓縮等等一系列選項。

其他(tā)配置項細節可(kě)以參考文檔 開發者工具的(de)配置 。

頁面配置 page.json

這(zhè)裏的(de) page.json 其實用(yòng)來(lái)表示 pages/logs 目錄下(xià)的(de) logs.json 這(zhè)類和(hé)小程序頁面相關的(de)配置。

如果你整個(gè)小程序的(de)風格是藍色調，那麽你可(kě)以在 app.json 裏邊聲明(míng)頂部顔色是藍色即可(kě)。實際情況可(kě)能不是這(zhè)樣，可(kě)能你小程序裏邊的(de)每個(gè)頁面都有不一樣的(de)色調來(lái)區(qū)分(fēn)不同功能模塊，因此我們提供了(le) page.json，讓開發者可(kě)以獨立定義每個(gè)頁面的(de)一些屬性，例如剛剛說的(de)頂部顔色、是否允許下(xià)拉刷新等等。其他(tā)配置項細節可(kě)以參考文檔 小程序的(de)配置 page.json 。