微信小程序的配置(项目开发配置、小程序收录配置、全局配置、页面配置)

小程序中常用的配置(项目开发配置、小程序收录配置、全局配置、页面配置)前言:小程序的很多开发需求被规定在了配置文件中。为什么这样做?这样做可以更有利于我们的开发效率；并且可以保证开发出来的小程序的某些风格是比较一致的；比如导航栏 – 顶部TabBar，以及页面路由等等。1. 项目开发配置（对应的文件->project.config.json）先附上微信官方给的文档微信小程序项目配置文件文档下

wantLG

3970人浏览 · 2020-09-28 16:03:05

wantLG · 2020-09-28 16:03:05 发布

文前推荐一下👉前端必备工具推荐网站(图床、API和ChatAI、智能AI简历、AI思维导图神器等实用工具):
站点入口：http://luckycola.com.cn/
图床：https://luckycola.com.cn/public/dist/#/imghub
多种API：https://luckycola.com.cn/public/dist/#/
ChatAI：https://luckycola.com.cn/public/dist/#/chatAi
AI思维导图神器：https://luckycola.com.cn/public/dist/#/aiQStore/aiMindPage

小程序中常用的配置(项目开发配置、小程序收录配置、全局配置、页面配置)

前言:小程序的很多开发需求被规定在了配置文件中。

为什么这样做?

这样做可以更有利于我们的开发效率；
并且可以保证开发出来的小程序的某些风格是比较一致的；
比如导航栏 – 顶部TabBar，以及页面路由等等。

1. 项目开发配置（对应的文件->project.config.json）

先附上微信官方给的文档微信小程序项目配置文件文档
下面是对应的文件
这个项目配置文件里面的配置项一般不用手敲，它有可视化操作界面,在微信开发者工具中右上角详细中,下面图示：
在可视化中每更改一项在project.config.json中都会有相应的改变

2. 小程序收录配置(对应的文件->sitemap.json)

传送门：小程序搜索相关的—微信小程序提供的sitemap.json配置文档
小程序根目录下的 sitemap.json 文件用于配置小程序及其页面是否允许被微信索引，文件内容为一个 JSON 对象，如果没有 sitemap.json ，则默认为所有页面都允许被索引；sitemap.json

2.1 希望被收录

使用场景:官网、商城、工具等一些面向大众的，希望更多人使用的小程序

配置项

属性	类型	必填	描述
rules	Object[]	是	索引规则列表

rules

rules 配置项指定了索引规则，每项规则为一个JSON对象，属性如下所示：

属性	类型	必填	默认值	取值	取值说明
action	string	否	“allow”	“allow”、“disallow”	命中该规则的页面是否能被索引
page	string	是		“*”、页面的路径	`*` 表示所有页面，不能作为通配符使用
params	string[]	否	[ ]		当 page 字段指定的页面在被本规则匹配时可能使用的页面参数名称的列表（不含参数值）
matching	string	否	“inclusive”	参考 matching 取值说明	当 page 字段指定的页面在被本规则匹配时，此参数说明 params 匹配方式
priority	Number	否			优先级，值越大则规则越早被匹配，否则默认从上到下匹配

matching 取值说明

值	说明
exact	当小程序页面的参数列表等于 params 时，规则命中
inclusive	当小程序页面的参数列表包含 params 时，规则命中
exclusive	当小程序页面的参数列表与 params 交集为空时，规则命中
partial	当小程序页面的参数列表与 params 交集不为空时，规则命中

下面是配置示例

示例1

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "exact"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}

path/to/page?a=1&b=2 => 优先索引
path/to/page => 不被索引
path/to/page?a=1 => 不被索引
path/to/page?a=1&b=2&c=3 => 不被索引
其他页面都会被索引

示例2

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "inclusive"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}

path/to/page?a=1&b=2 => 优先索引
path/to/page?a=1&b=2&c=3 => 优先索引
path/to/page => 不被索引
path/to/page?a=1 => 不被索引
其他页面都会被索引

示例3

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "exclusive"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}

path/to/page => 优先索引
path/to/page?c=3 => 优先索引
path/to/page?a=1 => 不被索引
path/to/page?a=1&b=2 => 不被索引
其他页面都会被索引

示例4

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "partial"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}

path/to/page?a=1 => 优先索引
path/to/page?a=1&b=2 => 优先索引
path/to/page => 不被索引
path/to/page?c=3 => 不被索引
其他页面都会被索引

注：没有 sitemap.json 则默认所有页面都能被索引
注：{“action”: “allow”, “page”: “*”} 是优先级最低的默认规则，未显式指明 “disallow” 的都默认被索引

2.2 不希望被收录

使用场景:企业内部系统等一些定向型用户应用，不做大范围推广

登录小程序微信小程序登录入口，点击设置，在设置中配置

隐私设置:
收录设置:

只要关闭以上两个选项就行

3. 全局配置

全局配置比较多，先放上官方文档全局配置
完整的查看官方文档,下面放上几个重要的

window: 全局的默认窗口展示
用户指定窗口如何展示, 其中还包含了很多其他的属性
常用配置

{
"window": {
    "navigationBarBackgroundColor": "#75a342",
    "navigationBarTextStyle": "white",
    "navigationBarTitleText": "普粒志鸟",
    "backgroundColor": "#e0e0e0",
    "backgroundTextStyle": "dark",
    "enablePullDownRefresh": true
  },
   "sitemapLocation": "sitemap.json"
}

所有配置

在这里插入图片描述

tabBar: 底部tab栏的展示
如果小程序是一个多 tab 应用（客户端窗口的底部或顶部有 tab 栏可以切换页面），可以通过 tabBar 配置项指定 tab 栏的表现，以及 tab 切换时显示的对应页面。
常用配置

{
"tabBar":{
   "selectedColor": "#75a342",
   "list": [
     {
       "pagePath": "pages/home/home",
       "text": "首页",
       "iconPath": "assets/tabbar/home_default.png",
       "selectedIconPath": "assets/tabbar/home_selected.png"
     },
     {
       "pagePath": "pages/category/category",
       "text": "普歌",
       "iconPath": "assets/tabbar/category_default.png",
       "selectedIconPath": "assets/tabbar/category_selected.png"
     },
     {
       "pagePath": "pages/gl/gl",
       "text": "高禄",
       "iconPath": "assets/tabbar/shoppingcart_default.png",
       "selectedIconPath": "assets/tabbar/shoppingcart_selected.png"
     },
     {
       "pagePath": "pages/mine/mine",
       "text": "我的",
       "iconPath": "assets/tabbar/mine_default.png",
       "selectedIconPath": "assets/tabbar/mine_selected.png"
     }
   ]
}

tarBar

图示:

pages: 页面路径列表

概念

用于指定小程序由哪些页面组成，每一项都对应一个页面的路径（含文件名）信息
小程序中所有的页面都是必须在pages中进行注册的

配置

每一个小程序页面也可以使用 .json 文件来对本页面的窗口表现进行配置
页面中配置项在当前页面会覆盖 app.json 的 window 中相同的配置项

常用配置

{
  "usingComponents": {},
  "navigationBarTitleText": "商品分类",
  "navigationBarBackgroundColor": "#ff0000",
  "navigationBarTextStyle": "black",
  "enablePullDownRefresh": true
}

4. 页面配置

文件:页面.json(某个页面的json文件)，页面配置,文档传送门页面配置文档
基本和全局配置中的window配置一样
每一个小程序页面也可以使用 .json 文件来对本页面的窗口表现进行配置。页面中配置项在当前页面会覆盖 app.json 的 window 中相同的配置项。文件内容为一个 JSON 对象，有以下属性：
配置项

属性	类型	默认值	描述	最低版本
navigationBarBackgroundColor	HexColor	#000000	导航栏背景颜色，如 #000000
navigationBarTextStyle	string	white	导航栏标题颜色，仅支持 black / white
navigationBarTitleText string	导航栏标题文字内容
navigationStyle	string	default	导航栏样式，仅支持以下值：`default 默认样式` `custom 自定义导航栏，`只保留右上角胶囊按钮	微信客户端 7.0.0
backgroundColor	HexColor	#ffffff	窗口的背景色
backgroundTextStyle	string	dark	下拉 loading 的样式，仅支持 dark / light
backgroundColorTop	string	#ffffff	顶部窗口的背景色，仅 iOS 支持	微信客户端 6.5.16
backgroundColorBottom	string	#ffffff	底部窗口的背景色，仅 iOS 支持	微信客户端 6.5.16
enablePullDownRefresh	boolean	false	是否开启当前页面下拉刷新。详见 Page.onPullDownRefresh
onReachBottomDistance	number	50	页面上拉触底事件触发时距页面底部距离，单位为px。详见 Page.onReachBottom
pageOrientation	string	portrait	屏幕旋转设置，支持 auto / portrait / landscape详见响应显示区域变化	2.4.0 (auto) / 2.5.0 (landscape)
disableScroll	boolean	false	设置为 true 则页面整体不能上下滚动。只在页面配置中有效，无法在 app.json 中设置
usingComponents	Object	否	页面自定义组件配置	1.6.3
style	string	default	启用新版的组件样式	2.10.2
singlePage	Object	否	单页模式相关配置	2.12.0