weapp-poem 项目教程

weapp-poem 项目教程

weapp-poem 诗词墨客 - 最全中华古诗词小程序 项目地址: https://gitcode.com/gh_mirrors/we/weapp-poem

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

weapp-poem/
├── app.js
├── app.json
├── app.wxss
├── components/
│   ├── poem-item/
│   │   ├── poem-item.js
│   │   ├── poem-item.json
│   │   ├── poem-item.wxml
│   │   └── poem-item.wxss
│   └── ...
├── pages/
│   ├── index/
│   │   ├── index.js
│   │   ├── index.json
│   │   ├── index.wxml
│   │   └── index.wxss
│   └── ...
├── project.config.json
└── README.md

• app.js: 小程序的入口文件，负责初始化小程序的全局数据和逻辑。
• app.json: 小程序的全局配置文件，定义了小程序的页面路径、窗口表现、网络超时时间等。
• app.wxss: 小程序的全局样式文件，定义了小程序的全局样式。
• components/: 存放小程序的自定义组件。
• pages/: 存放小程序的页面文件，每个页面由四个文件组成：.js、.json、.wxml、.wxss。
• project.config.json: 项目的配置文件，包含了小程序的开发工具配置信息。
• README.md: 项目的说明文档。

2. 项目的启动文件介绍

app.js 是小程序的启动文件，负责初始化小程序的全局数据和逻辑。以下是 app.js 的基本结构：

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

• onLaunch: 小程序启动时执行的函数，通常用于初始化全局数据或进行一些初始化操作。
• globalData: 定义的全局数据，可以在小程序的各个页面中访问。

3. 项目的配置文件介绍

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

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "navigationBarTitleText": "诗集小程序",
    "navigationBarBackgroundColor": "#ffffff",
    "navigationBarTextStyle": "black"
  },
  "networkTimeout": {
    "request": 10000,
    "downloadFile": 10000
  },
  "debug": true
}

• pages: 定义了小程序的页面路径，每个路径对应一个页面。
• window: 定义了小程序的窗口表现，如导航栏的标题、背景颜色、文字颜色等。
• networkTimeout: 定义了网络请求的超时时间。
• debug: 是否开启调试模式。

project.config.json 是项目的配置文件，包含了小程序的开发工具配置信息。以下是 project.config.json 的基本结构：

{
  "miniprogramRoot": "./",
  "projectname": "weapp-poem",
  "description": "一个展示诗歌的小程序",
  "appid": "touristappid",
  "setting": {
    "urlCheck": true,
    "es6": true,
    "postcss": true,
    "minified": true
  },
  "compileType": "miniprogram"
}

• miniprogramRoot: 小程序的根目录。
• projectname: 项目的名称。
• description: 项目的描述。
• appid: 小程序的 AppID。
• setting: 开发工具的配置，如是否启用 URL 检查、ES6 转 ES5、自动补全 CSS 前缀、代码压缩等。
• compileType: 编译类型，通常为 miniprogram。

weapp-poem 诗词墨客 - 最全中华古诗词小程序 项目地址: https://gitcode.com/gh_mirrors/we/weapp-poem