WXBaiSi 小程序项目教程

WXBaiSi 小程序项目教程

WXBaiSi项目地址:https://gitcode.com/gh_mirrors/wx/WXBaiSi

1. 项目的目录结构及介绍

WXBaiSi 小程序项目的目录结构如下：

WXBaiSi/
├── app.json
├── pages/
│   ├── index/
│   │   ├── index.js
│   │   ├── index.json
│   │   ├── index.wxml
│   │   └── index.wxss
│   ├── login/
│   │   ├── login.js
│   │   ├── login.json
│   │   ├── login.wxml
│   │   └── login.wxss
│   ├── membercenter/
│   │   ├── membercenter.js
│   │   ├── membercenter.json
│   │   ├── membercenter.wxml
│   │   └── membercenter.wxss
│   ├── recommend/
│   │   ├── recommend.js
│   │   ├── recommend.json
│   │   ├── recommend.wxml
│   │   └── recommend.wxss
│   ├── attention/
│   │   ├── attention.js
│   │   ├── attention.json
│   │   ├── attention.wxml
│   │   └── attention.wxss
├── images/
│   └── tabBar/
│       ├── tabBar_essence_click_icon.png
│       ├── tabBar_essence_icon.png
│       ├── tabBar_new_click_icon.png
│       ├── tabBar_new_icon.png
│       ├── tabBar_friendTrends_click_icon.png
│       ├── tabBar_friendTrends_icon.png
│       ├── tabBar_me_click_icon.png
│       └── tabBar_me_icon.png

目录结构介绍

• app.json: 小程序的全局配置文件。
• pages/: 存放小程序的各个页面。
  • index/: 首页。
  • login/: 登录页。
  • membercenter/: 会员中心页。
  • recommend/: 推荐关注页。
  • attention/: 关注页。
• images/: 存放小程序所需的图片资源。
  • tabBar/: 存放底部导航栏的图标。

2. 项目的启动文件介绍

小程序的启动文件是 app.json，它包含了小程序的全局配置信息。以下是 app.json 的内容：

{
  "pages": [
    "pages/index/index",
    "pages/index/detail",
    "pages/login/login",
    "pages/membercenter/membercenter",
    "pages/recommend/recommend",
    "pages/attention/attention"
  ],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#000",
    "navigationBarTitleText": "",
    "navigationBarTextStyle": "white",
    "backgroundColor": "#eaeaea"
  },
  "tabBar": {
    "color": "black",
    "borderStyle": "white",
    "selectedColor": "rgb(176, 170, 168)",
    "backgroundColor": "white",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "精华",
        "iconPath": "images/tabBar/tabBar_essence_click_icon.png",
        "selectedIconPath": "images/tabBar/tabBar_essence_icon.png"
      },
      {
        "pagePath": "pages/recommend/recommend",
        "text": "推荐关注",
        "iconPath": "images/tabBar/tabBar_new_click_icon.png",
        "selectedIconPath": "images/tabBar/tabBar_new_icon.png"
      },
      {
        "pagePath": "pages/attention/attention",
        "text": "关注",
        "iconPath": "images/tabBar/tabBar_friendTrends_click_icon.png",
        "selectedIconPath": "images/tabBar/tabBar_friendTrends_icon.png"
      },
      {
        "pagePath": "pages/membercenter/membercenter",
        "text": "我",
        "iconPath": "images/tabBar/tabBar_me_click_icon.png

WXBaiSi项目地址:https://gitcode.com/gh_mirrors/wx/WXBaiSi