1. MINA文件结构概述
微信小程序是一种快速开发的应用，相对于传统的大型应用来说，文件结构也显得很小巧，但是依旧需要有一定的规范性。MINA即是小程序文件结构的名称，由 JSON 配置、WXML、WXSS 和 JS 代码构成四部分。
1.1 解释每个文件夹的作用
在根目录中，app.js 是整个小程序的入口，app.json 是全局配置文件，用于对整个小程序进行配置，如设置页面路径、引入第三方库等。而<Strong>pages文件夹则存放着应用中所有的页面（小程序目前可以拥有的页面数最多为 40 个）及其相关的文件，例如页面的 WXML 模板（前端 HTML 部分）、JS 脚本、WXSS 样式等，各页面文件应该放在该文件夹下的各自目录中。
utils 是一个用于存放公共的异步请求、验证信息等函数的文件夹，方便文件管理。
images 文件夹中用于存放图片文件，可以根据应用的需求添加子文件夹以更好地管理图片文件。
其他文件夹下可能会存在该文件夹同名的文件夹或文件，例如在 pages 文件夹下的 index 页面文件夹内可能包含 index.wxml、index.js、index.wxss 以及其他文件。
2. app.json文件
app.json 是全局配置文件，在编写小程序时，需要先定义好每个页面的路径，而这些路径就是通过 app.json 文件来定义的。例如下面的代码：
{
"pages": [
"pages/index/index",
"pages/logs/logs"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "微信小程序DEMO",
"navigationBarTextStyle": "black"
},
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
"debug": true
}
上方代码中的 pages 数组表示应用中所有的页面路径，顺序代表页面的创建顺序，所以第一个页面通常是应用的首页，支持相对路径和绝对路径。区别在于，相对路径要相对于app.json文件位置，绝对路径则用 / 表示应用根路径。
在代码中也可以设置应用窗口的背景、导航条样式、底部tab栏等，安全域名、网络设置和调试输出日志的模式，如上方代码所示的 window、networkTimeout 和 debug。
3. WXML文件
WXML 是一种类似于 HTML 的格式化语言，目的是用于将数据渲染成页面，包含了标签、事件绑定、数据绑定等等。以下是简单的 WXML 代码实例：
<!--hello.wxml-->
<view>{{text}}</view>
//hello.js
Page({
data: {
text: "Hello World"
}
})
//hello.json
{
"navigationBarTitleText": "Hello"
}
WXML 代码中的 {{text}}，实现的效果是将数据绑定到前端页面上，text 是在小程序中声明的数据，而声明数据的部分通常放在JS文件中，作为页面对应的逻辑模块。
4. WXSS文件
WXSS 是一种类似于 CSS 的样式表语言，基本语法与 CSS 相同，也可以使用 Less 和 Sass 等预处理器。以下是 WXSS 的基本语法：
/* 样式类 */
.example {
color: #F00;
font-size: 16px;
}
/* 元素选择器 */
view {
display: block;
}
在 WXSS 中，选择器的优先级比 CSS 中更高，这意味着可以支持更方便的样式类封装。另外，由于小程序需要考虑到性能和文件大小的问题，所以建议将不同的样式放在不同的 WXSS 文件中，并通过 @import 引入。
5. JS文件
在编写小程序时，JS 文件即是页面的逻辑模块，可以善用生命周期函数和API接口，来完成相应的业务逻辑。例如在监听页面加载时获取用户信息的代码如下所示：
Page({
onLoad: function(options) {
wx.getUserInfo({
success: function(res) {
console.log(res.userInfo)
}
})
}
})
在生命周期函数 onLoad 中，通过 API 接口 wx.getUserInfo() 获取用户信息，并将返回的信息打印在控制台上。除了定义页面逻辑之外，JS 文件还可以定义一些全局数据和方法，例如全局数据可以放置在 app.js 文件中，然后通过 getApp() 方法获取。
总结
以上就是微信小程序的 MINA 文件结构以及一些基本介绍，其中 app.json、WXML、WXSS 和 JS 文件分别代表了全局配置、前端 HTML、样式表和逻辑模块，它们相互配合完成小程序的构建。使用他们进行构建，能够大大提高小程序的编写效率和页面性能，同时也给移动端的前端开发带来了革命性的改变。