qm-mp

轻芒小程序公用代码库。

Usage no npm install needed!

<script type="module">
  import qmMp from 'https://cdn.skypack.dev/qm-mp';
</script>

README

QM-MP

轻芒小程序公用代码库。

开发命令

  • npm run dev - 开发时生成未压缩的代码到 lib 中
  • npm run build - 生成生产环境需要的代码到 lib 中
  • npm run test - 针对 lib 中的代码进行测试
  • npm run test:watch - 监听 test 目录改动，自动执行测试

核心代码

此项目中的 Util 只会放一些最常用的函数，核心是 Service 部分，其中包括:

  1. 完整的 Auth 机制，包含登录判断，授权请求，用户信息状态管理
  2. Logger 库，方便跨项目统一 Event 参数

示例代码

import {
  configUpdater, authAPI, userStore,
  logger, errorReporter, savePhotoToAlbum
} from 'qm-mp'

// 第一步，更新 Config
configUpdater({
  name: 'test',
  wxAppId: 'xxxxxx'
})

// 第二步，用户授权
// 默认授权页面为 `pages/account/auth`
page({
  async handleLoginButtonTap () {
    ...
    await authAPI.loginViaWeChat()
    ...
  }
})

// 第三步，通过 Page Mixin 绑定用户数据
Page({
  userSubscription

  data: {
    userInfo: null
  },

  onShow () {
    this.userSubscription = userStore.subscribe(state => {
      this.setData('userInfo', state.userInfo)
   })
  },

  onHide () {
    if (this.userSubscription) {
      this.userSubscription.unsubscribe()
      this.userSubscription = null
    }
  }

})

// 其他使用：Logger, Util, API...
logger.logAction('render')
errorReporter('输入具体报错信息')
savePhotoToAlbum(imageUrl)

QM-MP 被真实项目 Haha-Meme-MP 引用，可以通过查看项目源代码了解如何使用 QM-MP。