微信小程序的目录结构通常包括以下主要部分:
这是一个典型的微信小程序的目录结构,具体项目可能会有一些变化,但通常都包含类似的核心文件和文件夹。小程序开发者需要按照这个结构组织项目代码和资源
- app.js:小程序的主入口文件,用于定义小程序的全局配置,包括小程序的生命周期函数、全局变量等。
- app.json:小程序的全局配置文件,包含小程序的全局配置信息,如页面路径、窗口表现、底部 tab 栏、网络超时时间等。
- app.wxss:小程序的全局样式文件,定义小程序的全局样式,通常包括一些基本样式和公共样式。
- project.config.json(可选):开发者工具的项目配置文件,包含一些开发工具相关的配置,如项目设置、域名配置等。
- pages文件夹:存放小程序的页面文件,每个页面通常包含以下文件:
- .js 文件:页面的逻辑文件,包括页面的生命周期函数、事件处理等。
- .json 文件:页面的配置文件,包括页面标题、导航栏样式、页面参数等。
- .wxml 文件:页面的结构文件,用于定义页面的布局结构。
- .wxss 文件:页面的样式文件,用于定义页面的样式。
- 示例页面目录结构:
pages/ └── index/ ├── index.js ├── index.json ├── index.wxml ├── index.wxss
- images 文件夹(可选):存放小程序中使用的图片资源。
- utils 文件夹(可选):存放一些工具类或公共函数的文件,用于在小程序中进行复用。
- components 文件夹(可选):存放小程序的自定义组件,用于实现页面的模块化和复用。
- static 文件夹(可选):存放一些静态资源文件,如音频、视频等。
- miniprogram_npm 文件夹(可选):用于存放小程序使用的 npm 包,当小程序项目引入第三方库时会生成该文件夹。
- 创建页面时直接在 app.json 里直接创建要用的页面。