WeApp-HiApp 微信小程序开发教程
weapp-hiappHiApp 微信小程序版项目地址:https://gitcode.com/gh_mirrors/we/weapp-hiapp
1、项目的目录结构及介绍
WeApp-HiApp 项目的目录结构如下:
weapp-hiapp/
├── src/
│ ├── components/
│ ├── pages/
│ ├── app.wpy
│ ├── config.js
│ ├── index.template.html
├── .editorconfig
├── .eslintignore
├── .eslintrc.js
├── .gitattributes
├── .gitignore
├── .prettierrc
├── .wepyignore
├── LICENSE.md
├── README.md
├── package-lock.json
├── package.json
├── project.config.json
├── wepy.config.js
目录结构介绍
src/
:项目的源代码目录。components/
:存放小程序的自定义组件。pages/
:存放小程序的页面文件。app.wpy
:小程序的入口文件。config.js
:项目的配置文件。index.template.html
:小程序的模板文件。
.editorconfig
:编辑器配置文件。.eslintignore
:ESLint 忽略配置文件。.eslintrc.js
:ESLint 配置文件。.gitattributes
:Git 属性配置文件。.gitignore
:Git 忽略配置文件。.prettierrc
:Prettier 代码格式化配置文件。.wepyignore
:Wepy 忽略配置文件。LICENSE.md
:项目许可证文件。README.md
:项目说明文件。package-lock.json
:npm 依赖锁定文件。package.json
:npm 项目配置文件。project.config.json
:微信开发者工具项目配置文件。wepy.config.js
:Wepy 框架配置文件。
2、项目的启动文件介绍
项目的启动文件是 src/app.wpy
,它是小程序的入口文件,包含了小程序的全局配置和生命周期函数。
app.wpy
文件内容示例
import wepy from 'wepy';
export default class extends wepy.app {
config = {
pages: [
'pages/index',
'pages/logs'
],
window: {
backgroundTextStyle: 'light',
navigationBarBackgroundColor: '#fff',
navigationBarTitleText: 'WeChat',
navigationBarTextStyle: 'black'
}
};
onLaunch() {
console.log('App Launch');
}
onShow() {
console.log('App Show');
}
onHide() {
console.log('App Hide');
}
}
启动文件介绍
config
:小程序的全局配置,包括页面路径、窗口表现等。onLaunch
:小程序启动时的回调函数。onShow
:小程序显示时的回调函数。onHide
:小程序隐藏时的回调函数。
3、项目的配置文件介绍
项目的配置文件主要包括 project.config.json
和 wepy.config.js
。
project.config.json
文件内容示例
{
"miniprogramRoot": "dist/",
"projectname": "weapp-hiapp",
"description": "HiApp 微信小程序版",
"appid": "touristappid",
"setting": {
"urlCheck": true,
"es6": false,
"postcss": false,
"minified": false
},
"compileType": "miniprogram"
}
project.config.json
配置文件介绍
miniprogramRoot
:小程序的输出目录。projectname
:项目名称。description
:项目描述。appid
:小程序的 AppID。setting
:编译设置,包括 URL 检查、ES6 转 ES5、PostCSS、代码压缩等。compileType
:编译类型,这里是小程序。
wepy.config.js
文件内容示例
weapp-hiappHiApp 微信小程序版项目地址:https://gitcode.com/gh_mirrors/we/weapp-hiapp