微信小程序必須通過官方的微信開發者工具進行開發，每一個頁面都至少由兩部分組成 .wxml,.js，也有可能會有 .wxss, .json它們分別對應普通的HTML，JS, CSS但是又有細微的差別。
首先默認首頁是index.wxml，其中app.js, app.json, app.wxs中存放一些全局公共的東西。
1.首先介紹app.json中的結構：
它是由json數據對構成，
eg:
{
"pages":[ //各個頁面的路徑
"pages/index/index", //默認的首頁，排在第一個的時默認首頁
"pages/logs/logs"
],
"window":{ //定義頂部導航條
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#200C3F", //頂部背景色
"navigationBarTitleText": "微信", //頂部文字內容
"navigationBarTextStyle":"#fff", //頂部文字顏色
"enablePullDownRefresh":true , //是否可以下拉刷新
"backgroundColor":"#fff", //下拉刷新時的背景顏色
},
"tabBar”:{ //定義底部切換按鈕樣式
"color":"#000”, //未選中時字的顏色
"selectedColor":"red”, //選中時字的顏色
"background":"#fff", //背景顏色
"borderStyle":"#000", //邊框的顏色（白，黑）
"list":[{ //總共幾個切換菜單就幾個
"pagePath":"pages/index/index”, //點擊時對應的頁面
"text":"首頁”, //顯示的文字
"iconPath":"images/footerShop.png”, //圖標的地址
"selectedIconPath":"images/footerShop1.png” //選中時圖標的地址
},{
"pagePath": "pages/logs/logs",
"text": "日誌",
"iconPath": "images/footerOrder.png",
"selectedIconPath": "images/footerOrder1.png"
}]
},
"networkTimeout”:{ //網絡請求超時時間
"request":30000,
"connectSocket":3000,
"uploadFile":3000,
"downloadFile":3000
},
"debug":true //是否在控制檯打印信息
}
- 相關的顏色值除了黑白以外，都應該用#+三位十六進制的數字構成;
- navigationBarBackgroundColor 表示頂部顏色，可以任意；
- navigationBarTitleText 表示頂部的文字；
- navigationBarTextStyle 表示頂部的文字顏色，只能有白色或者黑色；
- enablePullDownRefresh 表示頁面是否允許下拉刷新；
- 本頁面的各屬性屬於默認值，爲全局變量，當其他的頁面有相同的屬性時該頁面的屬性將覆蓋掉此屬性，但是他只在某一頁面內有效
2.app.wxss：
文件中寫一些通用的css樣式。
3.app.js:
本頁面的各屬性屬於默認值，爲全局變量，當其他的頁面有相同的屬性時該頁面的屬性將覆蓋掉此屬性，但是他只在某一頁面內有效