找到創(chuàng)建的 demo 文件夾，把項目導(dǎo)入到你的編輯器，這里使用的是Sublime Text編輯器。

 

 

 

 

這個時候需要根據(jù)自己的項目需求結(jié)構(gòu)進行更改了，項目根目錄下面是首頁渲染的幾個 tabBar 頁面，以及 app 的一些配置文件，如名片盒項目的 tabBar 是 3 個切換菜單

 

 

 

 

我們先找到 app.json 文件打開配置好這幾個菜單，配置好 tabBar，這個直接把配置文件改成你自己設(shè)計的即可。

 

 

 

 

App.json 里面有幾個配置項：

 

 

* Pages：這個是編寫的js文件，后綴.js這里不需要使用，配置好正確路徑即可正常調(diào)用（若調(diào)用不到，在重啟微信開發(fā)者工具會直接報 page 錯誤）。
* Window：配置頂部的一些樣式，文檔介紹比較詳細。
* tabBar：底部的幾項配置，見名知意。
* networkTimeout：暫時沒發(fā)現(xiàn)用處，建議看文檔。根據(jù)實際項目需求進行添加與更改。
* iconPath和selectedIconPath：底部菜單按鈕圖片與得到切換點擊高亮。
* text：可以去掉，全部去掉會發(fā)現(xiàn)底部 tabar 高度會減少很多。 

 

 

 

 

Json 文件配置好后，根據(jù)項目進行文件創(chuàng)建。
Demo：存放的是假數(shù)據(jù)，這一期的開發(fā)工具支持 require，假數(shù)據(jù)使用的是 .js 文件形式，
里面的數(shù)據(jù)結(jié)構(gòu) json 一致，把 data 暴露出去即可

 

 

 

 

然后取數(shù)據(jù) require 進來即可，這一點使用很方便；
Images：圖片路徑；
Page：除 tabar 以外的頁面；
Servise：服務(wù)交付層（與后臺聯(lián)調(diào)真實數(shù)據(jù)時使用）；
Wxss：一些公共的 css 文件；
看到這里大家發(fā)現(xiàn)每個頁面都被連帶好三個不同的后綴。分別頁面，css，js 目前只能依照這樣，是微信應(yīng)用號的一個規(guī)范吧。

 

 

 

 

Wxss 文件是引入你寫的樣式文件，也可以直接在里面寫樣式。

 

 

 

 

Js 文件需全部配置到 pages 里面才能生效。