小程序结构⽬录，配置⽂件

1.⼩程序结构⽬录

⼩程序框架提供了⾃⼰的视图层描述语⾔ WXML 和 WXSS ，以及 JavaScript ，并在视图层与逻 辑层间提供了数据传输和事件系统，让开发者能够专注于数据与逻辑。

1.1. ⼩程序⽂件结构和传统web对⽐

结构	传统web	微信⼩程序
结构	HTML	WXML
样式	CSS	WXSS
逻辑	Javascript	Javascript
配置	⽆	JSON

通过以上对⽐得出，传统web 是三层结构。⽽微信⼩程序 是四层结构，多了⼀层 配置.json

1.2. 基本的项⽬⽬录

2.⼩程序配置⽂件

⼩程序应⽤程序一般都会包括基本的两种配置⽂件。⼀个是全局的 app.json 和 ⻚⾯局部的page.json配置文件

2.1. 全局 app.json配置文件

app.json 是当前⼩程序的全局配置，pages数组中包含了⼩程序的所有⻚⾯路径、window对象中可配置⽹络超时时间，界⾯表现等，tabBar对象中配置底部tab等。普通快速启动项⽬⾥边的 app.json 配置

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

新建页面时，可以直接在 “pages”:[] 中加上新路径，保存，小程序编译器就会帮我们新建对应的文件

字段的含义

1. pages 字段⸺⽤于描述当前⼩程序所有⻚⾯路径，这是为了让微信客⼾端知道当前你的⼩程序 ⻚⾯定义在哪个⽬录。
2. window 字段⸺对⼩程序所有⻚⾯的⽂字颜⾊定义，顶部背景颜⾊等，局部会覆盖全部的定义。
3. 完整的配置信息请参考 app.json配置

2.1.1. tabbar配置

2.2 ⻚⾯配置 page.json

这⾥的 page.json 是每个页面目录下对应的配置文件。 开发者可以独⽴定义每个⻚⾯的⼀些属性，如顶部颜⾊、是否允许下拉刷新等等。 ⻚⾯的配置只能配置window 配置项 app.json 中部分的内容，⻚⾯中配置项会覆盖 全局app.json 中相同的配置项。

属性	类型	默认值	描述
navigationBarBackgroundColor	HexColor	#000000	导航栏背景颜⾊，如 #000000
navigationBarTextStyle	String	white	导航栏标题颜⾊，仅⽀持 black / white
navigationBarTitleText	String	导航栏标题⽂字内容
backgroundColor	HexColor	#ffffff	窗⼝的背景⾊
backgroundTextStyle	String	dark	下拉 loading 的样式，仅⽀持 dark / light
enablePullDownRefresh	Boolean	false	是否全局开启下拉刷新
onReachBottomDistance	Number	50	⻚⾯上拉触底事件触发时距⻚⾯底部距离，单位为px
disableScroll	Boolean	false	设置为 true 则⻚⾯整体不能上下滚动；只在⻚⾯配置中有 效，⽆法在 app.json 中设置该项