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