微信小程序基础

2023-07-21 23:17:28

1.准备工作

登陆微信公众平台注册账号获取appID（这步很简单，不多说）下载微信开发者工具基本使用不多介绍

2.微信小程序项目结构

.json为配置文件里面不能写注释而且里面用双引号不能用单引号（ json格式）
.wxml 为模板文件，相当于HTML模板
.wxss 为样式文件，相当于HTML的CSS样式表
.js 为JS 脚本逻辑文件，相当于HTML的js脚本

project.config.json 为配置文件一般不需要去更改它。在“微信开发者工具”上做的任何配置都会写入到这个文件。

文件必填作用
app.js 是小程序逻辑
app.json 是小程序公共配置作用：对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。
app.wxss 否小程序公共样式表 utils是公共的js函数文件，通过module.exports的方式暴露pages下的每个页面使用
不需要每个页面编写重复的Js代码。

3.微信小程序项目配置

全局配置（pages window tabBar debug）

https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html 官方全局配置链接

小程序根目录下的 app.json 文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等

{
  "pages": [
    "pages/index/index",
    "pages/course/course",
    "pages/weibo/weibo",
    "pages/logs/logs"
  ],
  "window": {
    "backgroundTextStyle": "dark",
    "navigationBarBackgroundColor": "#ccc",
    "navigationBarTitleText": "知了课堂",
    "navigationBarTextStyle": "black",
    "navigationStyle": "default",
    "backgroundColor": "pink",
    "enablePullDownRefresh": true
  },
  "tabBar": {
    "color": "#8a8a8a",
    "selectedColor": "#1AAD16",
    "backgroundColor": "#fff",
    "borderStyle": "white",
    "position": "top",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "微信",
        "iconPath": "images/tabbar/tabbar1.png",
        "selectedIconPath": "images/tabbar/tabbar1_selected.png"
      },
      {
        "pagePath": "pages/course/course",
        "text": "通讯录",
        "iconPath": "images/tabbar/tabbar2.png",
        "selectedIconPath": "images/tabbar/tabbar2_selected.png"
      },
      {
        "pagePath": "pages/weibo/weibo",
        "text": "发现",
        "iconPath": "images/tabbar/tabbar3.png",
        "selectedIconPath": "images/tabbar/tabbar3_selected.png"
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "我",
        "iconPath": "images/tabbar/tabbar4.png",
        "selectedIconPath": "images/tabbar/tabbar4_selected.png"
      }
    ]
  },
  "debug": false
}

页面配置

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

sitemap 配置

微信现已开放小程序内搜索，开发者可以通过 sitemap.json 配置，或者管理后台页面收录开关来配置其小程序页面是否允许微信索引。

码农公寓

全局配置（pages window tabBar debug）

sitemap 配置

相关文章