uniapp 目录结构

uniapp 项目常用的目录结构和每个文件的作用。

uniapp 目录结构

components                      // 组件目录
api                             // 封装接口目录
node_modules                    // 环境依赖
pages                           // 页面文件目录
    index                       // index 页面文件夹
        index.vue               // index 页面
static                          // 静态资源目录
uni_modules                     // uniapp 环境依赖
unpackage                       // 打包文件目录
common                          // 公共文件目录
App.vue                         // 根组件
index.html                      // 入口页面
main.js                         // 入口文件
manifest.json                   // 应用配置文件
pages.json                      // 页面配置文件
package.json                    // 插件管理文件
package-lock.json               // 插件版本锁定文件
uni.scss                        // 内置样式文件

1. components 文件夹：用于存放公共的组件，例如自定义的 tabBar 组件。
2. api 文件夹：用于存放封装好的 API 接口文件。
3. node_modules 文件夹：用于存放项目的各种依赖文件。大多数是通过 npm 安装的。
4. pages 文件夹：用于存放我们开发的 uniapp 页面，如 login、home 等页面。
5. static 文件夹：用于存放各种静态资源，img、css 等等。
6. uni_modules 文件夹：用于存放 uniapp 项目的各种依赖文件。
7. unpackage 文件夹：用于存放我们打包后的项目文件。
8. common 文件夹：公共文件夹，用于存放一些公共的 JS 文件。
9. App.vue 文件：根组件，是项目的主组件，所有的页面都要通过 App.vue 组件显示。
10. index.html 文件：项目入口页面，访问项目的时候会默认打开生成好的 index.html 文件。
11. main.js 文件：入口文件，主要用于初始化 uniapp 项目，也可以在此文件中引入一些组件库或者全局挂载一些变量。
12. manifest.json 文件：用于配置各种应用的名称、appid、logo、版本号等，配置打包后的信息。
13. pages.json 文件：用于配置页面路由、导航栏、选项卡等，配置页面的信息。
14. package.json 文件：插件的基本信息，包含项目开发时所需要的插件版本等。
15. package-lock.json 文件：用于记录当前项目实际安装的各个插件具体来源地址和版本号。
16. uni.scss 文件：uniapp 项目内置的全局样式变量。

原创作者：吴小糖

创作时间：2023.12.28