微信小程序代码 app.json文件详细介绍

2024-08-31 04:28

本文主要是介绍微信小程序代码 app.json文件详细介绍,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

目录

app.json 文件的作用

app.json 文件结构

app.json 文件属性介绍

pages 页面路径配置

window 主窗口主题样式

tabBar 底部导航栏

networkTimeout 网络超时时间

debug 调试模式

permission 申请手机权限

sitemapLocation

style

lazyCodeLoading 懒加载

requiredBackgroundModes 后台运行

functionalPages 分包预下载-加速

subpackages 分包加在-加速

workers

plugins 插件

useExtendedLib 功能扩展

preloadRule 页面加载-加速

entryPagePath

themeLocation 主题文件

darkmode 暗黑模式


官网:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html

app.json 文件的作用

app.json 是微信小程序的全局配置文件,用于配置小程序的页面路径、窗口表现、底部 Tab、网络超时时间、以及一些多媒体和权限设置等。这个文件在小程序启动时会被读取,并根据其中的配置来初始化小程序的各个部分。

app.json 文件结构

{"pages": ["pages/index/index"],"window": {"navigationBarTextStyle": "black","navigationStyle": "custom"},"style": "v2","renderer": "skyline","rendererOptions": {"skyline": {"defaultDisplayBlock": true,"disableABTest": true,"sdkVersionBegin": "3.0.0","sdkVersionEnd": "15.255.255"}},"componentFramework": "glass-easel","sitemapLocation": "sitemap.json","lazyCodeLoading": "requiredComponents"
}

app.json 文件属性介绍

pages 页面路径配置

一个数组,用于配置小程序的页面路径。页面路径是相对于小程序根目录的相对路径。数组中的第一个页面是小程序的首页。每个路径对应一个小程序页面,路径中的文件夹名称不能有大写字母。

    "pages": ["pages/index/index","pages/logs/logs"],

window 主窗口主题样式

window 对象用于设置小程序的全局默认窗口表现,如导航栏的背景色、文字颜色、标题等。

  • navigationBarBackgroundColor: 导航栏背景颜色(十六进制颜色值)。
  • navigationBarTextStyle: 导航栏标题颜色,仅支持 black(黑色)或 white(白色)。
  • navigationBarTitleText: 导航栏标题文字内容。
  • backgroundColor: 窗口的背景色(十六进制颜色值)。
  • backgroundTextStyle: 下拉背景字体、loading 图的样式,仅支持 dark、light。
  • enablePullDownRefresh: 是否开启下拉刷新功能,true 或 false。
  • onReachBottomDistance: 页面上拉触底事件触发时距页面底部距离,单位为 px。
"window": {"navigationBarBackgroundColor": "#ffffff","navigationBarTextStyle": "black","navigationBarTitleText": "小程序名称","backgroundColor": "#eeeeee","backgroundTextStyle": "light","enablePullDownRefresh": false,"onReachBottomDistance": 50
}

tabBar 底部导航栏

tabBar 用于配置小程序的底部 Tab 栏的表现,包括 Tab 栏的样式及每个 Tab 的页面路径和图标。

  • color: 未选中时的文字颜色(十六进制颜色值)。
  • selectedColor: 选中时的文字颜色(十六进制颜色值)。
  • backgroundColor: Tab 栏的背景色(十六进制颜色值)。
  • borderStyle: Tab 栏上边框的颜色,仅支持 black 或 white。
  • list: 一个数组,用于配置 Tab 项,每一项都包括 pagePath(页面路径)、text(Tab 项文字)、iconPath(未选中时的图标路径)、selectedIconPath(选中时的图标路径)。
    "tabBar": {"color": "#8a8a8a","selectedColor": "#ff0000","backgroundColor": "#ffffff","borderStyle": "black","list": [{"pagePath": "pages/index/index","text": "首页","iconPath": "path/to/icon.png","selectedIconPath": "path/to/selected_icon.png"},{"pagePath": "pages/logs/logs","text": "日志"}]}

networkTimeout 网络超时时间

networkTimeout 用于设置小程序各种网络请求的超时时间,单位为毫秒。

  • request: wx.request 的超时时间。
  • connectSocket: wx.connectSocket 的超时时间。
  • uploadFile: wx.uploadFile 的超时时间。
  • downloadFile: wx.downloadFile 的超时时间。
    "networkTimeout": {"request": 10000,"connectSocket": 10000,"uploadFile": 10000,"downloadFile": 10000}

debug 调试模式

debug 属性用于是否开启调试模式,true 为开启,false 为关闭。开启调试模式时,开发者工具和移动设备的调试会打印详细的日志信息。

"debug": false

permission 申请手机权限

permission 用于配置小程序需要申请的权限,通常用于获取用户位置信息或其他敏感数据。

  • scope.userLocation: 配置请求用户地理位置的描述,用户授权时会看到这段文字。
    "permission": {"scope.userLocation": {"desc": "你的位置信息将用于小程序位置接口的效果展示"}}

sitemapLocation

sitemapLocation 用于设置小程序 sitemap.json 文件的路径。sitemap.json 文件用于配置小程序页面的收录与展示规则。

"sitemapLocation": "sitemap.json"

style

style 用于设置小程序的基础库使用的组件样式版本。值为 "v2" 时,使用基础库2.0版本的新样式。

"style": "v2"

lazyCodeLoading 懒加载

lazyCodeLoading 用于配置懒加载模式。可以选择 "requiredComponents",表示只有在页面中被使用到的组件才会被加载,未被使用的组件不会被加载到当前页面。

"lazyCodeLoading": "requiredComponents"

requiredBackgroundModes 后台运行

requiredBackgroundModes 用于配置小程序需要后台运行的能力。目前支持的值为 "audio",表示后台播放音频。

"requiredBackgroundModes": ["audio"]

functionalPages 分包预下载-加速

functionalPages 用于启用小程序的分包预下载功能,必须为 true 才能使用分包预下载。

"functionalPages": true

subpackages 分包加在-加速

subpackages(或 subPackages) 用于配置小程序的分包加载,以减少主包的体积,加快小程序启动速度。

  • name: 分包的名称。
  • root: 分包的根目录。
  • pages: 分包内的页面路径。
"subpackages": [{"name": "packageA","root": "packageA","pages": ["pages/index/index","pages/logs/logs"]},{"name": "packageB","root": "packageB","pages": ["pages/detail/detail"]}
]

workers

workers 用于配置 Worker 代码的目录。使用 Worker 可以在小程序中运行多线程任务。

"workers": "workers/"

plugins 插件

plugins 用于配置小程序使用的第三方插件。

  • myPlugin: 插件的名称。
  • version: 插件的版本号。
  • provider: 插件开发者的 AppID。
"plugins": {"myPlugin": {"version": "1.0.0","provider": "wx1234567890abcdef"}
}

navigateToMiniProgramAppIdList 用于配置当前小程序可跳转的其他小程序 AppID 列表。

"navigateToMiniProgramAppIdList": ["wx1234567890abc111","wxabcdef1234567111"
]

useExtendedLib 功能扩展

useExtendedLib 用于配置使用的扩展库,扩展库为小程序提供了更多的功能。

"useExtendedLib": {"weui": true
}

preloadRule 页面加载-加速

preloadRule 用于配置页面预加载规则,以提高页面加载速度。

  • pages/index/index: 需要预加载的页面。
  • network: 预加载的网络环境,wifi 或者 all。
  • packages: 预加载的分包。
"preloadRule": {"pages/index/index": {"network": "wifi","packages": ["packageA"]}
}

entryPagePath

指定小程序的默认启动路径(首页),常见情景是从微信聊天列表页下拉启动、小程序列表启动等。如果不填,将默认为 pages 列表的第一项。不支持带页面路径参数。

"entryPagePath": "pages/index/index"

themeLocation 主题文件

themeLocation 用于指定小程序主题配置文件的路径(从基础库 2.11.0 开始支持)。

"themeLocation": "miniprogram_npm/@my-theme/miniprogram-theme/index.theme.json"

darkmode 暗黑模式

darkmode 用于启用小程序的暗黑模式支持。

"darkmode": true

这篇关于微信小程序代码 app.json文件详细介绍的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1122886

相关文章

C#使用StackExchange.Redis实现分布式锁的两种方式介绍

《C#使用StackExchange.Redis实现分布式锁的两种方式介绍》分布式锁在集群的架构中发挥着重要的作用,:本文主要介绍C#使用StackExchange.Redis实现分布式锁的... 目录自定义分布式锁获取锁释放锁自动续期StackExchange.Redis分布式锁获取锁释放锁自动续期分布式

IntelliJ IDEA 中配置 Spring MVC 环境的详细步骤及问题解决

《IntelliJIDEA中配置SpringMVC环境的详细步骤及问题解决》:本文主要介绍IntelliJIDEA中配置SpringMVC环境的详细步骤及问题解决,本文分步骤结合实例给大... 目录步骤 1:创建 Maven Web 项目步骤 2:添加 Spring MVC 依赖1、保存后执行2、将新的依赖

MySQL 中的 JSON 查询案例详解

《MySQL中的JSON查询案例详解》:本文主要介绍MySQL的JSON查询的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录mysql 的 jsON 路径格式基本结构路径组件详解特殊语法元素实际示例简单路径复杂路径简写操作符注意MySQL 的 J

Spring Boot中JSON数值溢出问题从报错到优雅解决办法

《SpringBoot中JSON数值溢出问题从报错到优雅解决办法》:本文主要介绍SpringBoot中JSON数值溢出问题从报错到优雅的解决办法,通过修改字段类型为Long、添加全局异常处理和... 目录一、问题背景:为什么我的接口突然报错了?二、为什么会发生这个错误?1. Java 数据类型的“容量”限制

如何为Yarn配置国内源的详细教程

《如何为Yarn配置国内源的详细教程》在使用Yarn进行项目开发时,由于网络原因,直接使用官方源可能会导致下载速度慢或连接失败,配置国内源可以显著提高包的下载速度和稳定性,本文将详细介绍如何为Yarn... 目录一、查询当前使用的镜像源二、设置国内源1. 设置为淘宝镜像源2. 设置为其他国内源三、还原为官方

Spring 请求之传递 JSON 数据的操作方法

《Spring请求之传递JSON数据的操作方法》JSON就是一种数据格式,有自己的格式和语法,使用文本表示一个对象或数组的信息,因此JSON本质是字符串,主要负责在不同的语言中数据传递和交换,这... 目录jsON 概念JSON 语法JSON 的语法JSON 的两种结构JSON 字符串和 Java 对象互转

最详细安装 PostgreSQL方法及常见问题解决

《最详细安装PostgreSQL方法及常见问题解决》:本文主要介绍最详细安装PostgreSQL方法及常见问题解决,介绍了在Windows系统上安装PostgreSQL及Linux系统上安装Po... 目录一、在 Windows 系统上安装 PostgreSQL1. 下载 PostgreSQL 安装包2.

redis过期key的删除策略介绍

《redis过期key的删除策略介绍》:本文主要介绍redis过期key的删除策略,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录第一种策略:被动删除第二种策略:定期删除第三种策略:强制删除关于big key的清理UNLINK命令FLUSHALL/FLUSHDB命

MySql match against工具详细用法

《MySqlmatchagainst工具详细用法》在MySQL中,MATCH……AGAINST是全文索引(Full-Textindex)的查询语法,它允许你对文本进行高效的全文搜素,支持自然语言搜... 目录一、全文索引的基本概念二、创建全文索引三、自然语言搜索四、布尔搜索五、相关性排序六、全文索引的限制七

python中各种常见文件的读写操作与类型转换详细指南

《python中各种常见文件的读写操作与类型转换详细指南》这篇文章主要为大家详细介绍了python中各种常见文件(txt,xls,csv,sql,二进制文件)的读写操作与类型转换,感兴趣的小伙伴可以跟... 目录1.文件txt读写标准用法1.1写入文件1.2读取文件2. 二进制文件读取3. 大文件读取3.1