一：基本项目文件组成
除了上面默认有的三大目录，我们还可以自己新建一些用于某些用途的目录：
component：存放自定义组件的目录。（组件的定义与 page 的定义类似，只不过是采用 Component 对象来注册，并且要在json文件中声明 component=true）
images：存放图片的目录。
style：样式目录。
screenshot：截图保存目录。
audio：音频目录。
video：视频目录。
。。。。。。根据需要自己建立。
二：根目录
根目录主要分为两部分：程序主体部分 和 项目配置部分。
1：程序主体
小程序中维护一个 App 对象，代表整个程序本身，与之相关的一系列文件就是对程序内容的相关定义。
1）app.js
app.js定义了程序对象的相关逻辑，主要是 注册程序对象以及程序对象的生命周期函数、程序全局变量等。
格式为：
App({ //App() 函数用来注册一个小程序。接受一个 object 参数{在花括号中定义}，其指定小程序的生命周期函数等。
onLaunch: function(options) {
// Do something initial when launch.
},
onShow: function(options) {
// Do something when show.
},
onHide: function() {
// Do something when hide.
},
onError: function(msg) {
console.log(msg)
},
globalData: 'I am global data'//一个名为globalData的全局变量
})
其他page、component的js文件中可以获取App实例，通过实例来调用程序js中的逻辑函数、全局数据。
var appInstance = getApp() //获取App实例 console.log(appInstance.globalData) // 通过实例访问全局数据
2）app.json
app.json文件用来对小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。
格式为：
{ "pages": [ "页面文件的路径", ], "window": { //设置小程序的状态栏、导航条、标题、窗口背景色。 }, "tabBar": { "list": [{ "pagePath": "第一个tab的页面路径", "text": "第一个tab的标签文本" }, { "pagePath": "第二个tab的页面路径", "text": "第二个tab的标签文本" },{ ....其他tab配置 }] }, "networkTimeout": { //设置各种网络请求的超时时间。 }, "debug": 是否启动调试模式 }
pages：接收一个数组，每一项都是字符串，来指定小程序由哪些页面组成。每一项代表对应页面的【路径+wxml不带后缀的文件名】信息，数组的第一项代表小程序的初始页面。
window：设置小程序的状态栏、导航条、标题、窗口背景色、上拉下拉事件。
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| 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 |
配置tabBar：如果小程序是一个多 tab 应用（窗口的底部或顶部有 tab 栏可以切换页面），可以通过 tabBar 配置项指定 tab 标签的内容与属性，以及 tab 切换时显示的对应页面。
注意：
- 当设置 position 为 top 时，将不会显示 icon（顶部tabBar无图标）
- tabBar 中的 list 是一个数组，最少配置2个、最多5个tab，tab 按配置时的顺序排序。
tabBar标签的属性内容：
| 属性 | 类型 | 必填 | 默认值 | 描述 |
|---|---|---|---|---|
| color | HexColor | 是 | tab 上的文字默认颜色 | |
| selectedColor | HexColor | 是 | tab 上的文字选中时的颜色 | |
| backgroundColor | HexColor | 是 | tab 的背景色 | |
| borderStyle | String | 否 | black | tabbar上边框的颜色， 仅支持 black/white |
| list | Array | 是 | tab 的列表，详见 list 属性说明，最少2个、最多5个 tab | |
| position | String | 否 | bottom | 可选值 bottom、top //顶部导航栏or底部导航栏 |
list标签的内容：list 接受一个数组，数组中的每个项都是一个对象，每一个对象包含以下属性：
| 属性 | 类型 | 必填 | 说明 |
|---|---|---|---|
| pagePath | String | 是 | 页面路径，必须在 pages 中先定义 |
| text | String | 是 | tab 上按钮文字 |
| iconPath | String | 否 | 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px，当 postion 为 top 时，此参数无效，不支持网络图片 |
| selectedIconPath | String | 否 | 选中时的图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px ，当 postion 为 top 时，此参数无效 |
3）app.wxss
wxss是微信小程序的样式语言，用来定义 WXML 的组件应该怎么显示。
定义在 app.wxss 中的样式为全局样式，作用于程序中的每一个页面。在 page 的 wxss 文件中定义的样式为局部样式，只作用在对应的页面，并会覆盖 app.wxss 中相同的选择器。
2：项目配置文件
通常大家在使用一个工具的时候，都会针对各自喜好做一些个性化配置，例如界面颜色、编译配置等等，当你换了另外一台电脑重新安装工具的时候，你还要重新配置。
小程序开发者工具在每个项目的根目录都会生成一个 project.config.json，你在工具上做的任何配置都会写入到这个文件，当你重新安装工具或者换电脑工作时，你只要载入同一个项目的代码包，开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置，其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。
三：pages目录
pages目录下存放页面文件，一个子目录对应一个页面，子目录名就是页面名，如：
这里，定义了四个页面：cinema、home、logs、my。
每个页面子目录下包含了该页面的相关定义文件：页面描述文件wxml、页面样式文件wxss、页面逻辑文件js、页面配置文件json。如：
各种文件的具体内容与定义，在后续文章中梳理。
四：utils目录
工具目录，可以用于定义一些所有页面、组件公用的方法，比如：获取日期字符串、生成随机数等等功能函数。
我们可以在util.js中定义功能函数，也可以按照相关性，把同一类别的功能函数单独写进一个js文件，例如：创建time.js文件专门用于定义与时间处理的一系列函数。