微信小程序基础开发(一)----初步搭建

小程序的目录结构

image


小程序的配置

  • 全局配置(app.js)

1、pages:表示当前项目的子页面,并且路径与左侧的pages下的路径完全对应

"pages":[
    "pages/index/index",//pages下的第一个路径就是小程序进入显示的页面
    "pages/docu/docu",
    "pages/cander/cander",
    "pages/search/search",
    "pages/logs/logs",
    "pages/demo01/demo01"
  ], 

image

2、window:定义小程序所有页面的顶部背景颜色、文字颜色等
详情参考微信小程序官方文档

"window":{
    "backgroundTextStyle":"dark",//下拉刷新的动画,支持"dark"或"light"
    "navigationBarBackgroundColor": "#fff",//顶部导航栏背景颜色
    "navigationBarTitleText": "Weixin",//导航栏标题
    "navigationBarTextStyle":"black",//标题文字的颜色,只能"black"或"white"
    "enablePullDownRefresh":true //全局的下拉刷新,默认"false"
  },

3、tabBar:指定tab栏切换,list数组内最少两项
详情参考微信小程序官方文档

"tabBar": {
    "list": [
      {
      "pagePath":  "pages/index/index",
      "text": "扫一扫",
      "iconPath": "icon/sao1.png",
      "selectedIconPath": "icon/sao.png"
    },
    {
      "pagePath":  "pages/docu/docu",
      "text": "文件",
      "iconPath": "icon/docu1.png",
      "selectedIconPath": "icon/docu.png"
    },
    {
      "pagePath":  "pages/cander/cander",
      "text": "照相机",
      "iconPath": "icon/cander1.png",
      "selectedIconPath": "icon/cander.png"
    },
    {
      "pagePath":  "pages/search/search",
      "text": "查找",
      "iconPath": "icon/search1.png",
      "selectedIconPath": "icon/search.png"
    }
  ],

image

  • 页面配置

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

  • sitemap配置

sitemap官方文档
用于配置小程序及其页面是否允许被微信索引

你可能感兴趣的:(前端,javascript)