微信小程序示例 - 面包旅行 使用教程

微信小程序示例 - 面包旅行 使用教程

项目地址:https://gitcode.com/gh_mirrors/we/weapp-demo-breadtrip

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

weapp-demo-breadtrip/
├── app.js
├── app.json
├── app.wxss
├── pages/
│   ├── index/
│   │   ├── index.js
│   │   ├── index.json
│   │   ├── index.wxml
│   │   └── index.wxss
│   └── logs/
│       ├── logs.js
│       ├── logs.json
│       ├── logs.wxml
│       └── logs.wxss
├── utils/
│   └── util.js
└── package.json

• app.js: 小程序的入口文件，包含全局逻辑。
• app.json: 小程序的全局配置文件。
• app.wxss: 小程序的全局样式文件。
• pages/: 存放小程序的各个页面。
  • index/: 首页页面。
  • logs/: 日志页面。
• utils/: 存放工具函数。
• package.json: 项目的配置文件，包含依赖和脚本。

2. 项目的启动文件介绍

app.js

app.js 是小程序的入口文件，主要负责全局逻辑的初始化。以下是 app.js 的基本结构：

App({
  onLaunch: function () {
    // 小程序启动时的逻辑
  },
  globalData: {
    // 全局数据
  }
})

app.json

app.json 是小程序的全局配置文件，主要配置页面路径、窗口表现、网络超时时间等。以下是 app.json 的基本结构：

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "面包旅行",
    "navigationBarTextStyle": "black"
  }
}

3. 项目的配置文件介绍

package.json

package.json 是 Node.js 项目的配置文件，包含项目的元数据和依赖。以下是 package.json 的基本结构：

{
  "name": "weapp-demo-breadtrip",
  "version": "0.0.1",
  "description": "微信小程序示例 - 面包旅行",
  "main": "app.js",
  "scripts": {
    "lint": "eslint"
  },
  "keywords": [
    "breadtrip",
    "weapp"
  ],
  "author": "romoo chen <romoochen@gmail.com>",
  "license": "Apache-2.0",
  "devDependencies": {
    "eslint": "^3.9.1",
    "eslint-config-airbnb-base": "^9.0.0",
    "eslint-plugin-import": "^2.0.1"
  }
}

• name: 项目名称。
• version: 项目版本。
• description: 项目描述。
• main: 入口文件。
• scripts: 脚本命令。
• keywords: 项目关键词。
• author: 作者信息。
• license: 开源许可协议。
• devDependencies: 开发依赖。

weapp-demo-breadtrip 基于面包旅行 API 制作的微信小程序示例 项目地址: https://gitcode.com/gh_mirrors/we/weapp-demo-breadtrip