pages.json 和 manifest.json 有什么作用?uni-app 核心配置文件详解

张开发
2026/4/20 15:19:26 15 分钟阅读

分享文章

pages.json 和 manifest.json 有什么作用?uni-app 核心配置文件详解
在使用 uni-app 开发项目时我们会经常接触到两个最核心、最不能缺少的 JSON 配置文件pages.json和manifest.json。很多新手会疑惑这两个文件到底是干嘛的能不能删有什么区别这篇博客就用清晰、通俗、实战化的方式带你彻底搞懂 pages.json 和 manifest.json 的作用、区别、使用场景让你在开发 uni-app 时不再迷茫。一、先一句话分清两者pages.json管页面和全局样式、导航栏、tabBar等界面展示配置。manifest.json管项目本身包括应用名称、图标、权限、各端发布配置。一个管界面与页面一个管项目与发布分工非常明确。二、pages.json 作用详解1. 核心定位pages.json 是 uni-app 的页面配置文件用来告诉框架项目有哪些页面页面的路径是什么页面的标题、导航栏样式底部 tabBar 菜单全局下拉刷新、窗口样式等它相当于小程序的app.json是 uni-app 启动时必须读取的文件。2. 主要功能注册页面jsonpages: [ { path: pages/index/index, style: { navigationBarTitleText: 首页 } }, { path: pages/user/user, style: { navigationBarTitleText: 我的 } } ]必须在这里注册页面才能被访问第一项默认为首页全局样式配置globalStyle统一设置导航栏颜色、文字颜色、背景色等。底部 tabBar 配置配置 App 最常见的底部菜单。条件编译、启动页、分包加载优化小程序和 App 性能。3. 一句话总结pages.json 页面列表 界面样式 导航配置三、manifest.json 作用详解1. 核心定位manifest.json 是 uni-app 的项目配置文件用来描述整个应用的 “身份信息” 和 “运行环境”。它决定了你的项目打包后变成什么、叫什么名字、拥有什么权限。2. 主要功能应用基础信息应用名称、版本号、入口页面、描述。各端专属配置App 端图标、启动页、权限、安卓 /iOS 配置小程序端appid、小程序基础库版本H5 端网站标题、运行路径、打包配置权限管理如摄像头、定位、相册、网络、推送等权限。发布与打包控制控制打包后的应用行为、模块引用、是否开启原生渲染。示例结构json{ name: 我的应用, appid: __UNI__XXXXXXX, versionName: 1.0.0, app-plus: { modules: {}, distribute: { icons: {} } }, mp-weixin: { appid: wxXXXXXXX }, h5: { title: 我的H5网站 } }3. 一句话总结manifest.json 应用身份信息 各端打包配置 权限管理四、pages.json 和 manifest.json 核心区别表格速记表格对比项pages.jsonmanifest.json作用管理页面、导航、tabBar、界面样式管理应用信息、打包、权限、各端配置关注点页面结构 UI 样式项目本身 发布环境运行时影响决定页面能否打开、样式是否正确决定应用能否正常打包、运行、授权修改后效果立即生效通常需要重新编译 / 运行类比相当于 “目录、导航、菜单”相当于 “身份证、户口本、打包说明书”是否必须必须无则无法启动必须无则无法打包发布五、最容易混淆的 3 个问题1. 我想修改应用名称改哪个→manifest.json2. 我想新增页面、配置导航栏改哪个→pages.json3. 我想配置小程序 appid改哪个→manifest.json六、实战记忆口诀plaintext页面路由找 pages 导航 tab 它都管 应用身份看 manifest 打包权限全靠它。七、总结pages.json负责页面和界面控制你 “能看到什么”。manifest.json负责项目和发布控制应用 “是什么、能做什么、能打包成什么”。两者都是 uni-app 的核心基础配置缺一不可理解它们能让你更快掌握 uni-app 开发逻辑。总结pages.json管理页面路径、导航栏、tabBar、全局样式控制界面展示。manifest.json管理应用名称、版本、图标、权限、各端打包配置控制项目本身。两者分工明确是 uni-app 项目必须存在、不可删除的核心配置文件。

更多文章