uniapp之uni-starter小程序多端研发框架搭建与项目实践( 二 ) _生活百科

文章插图
4.2 AIPHD微信小程序项目研发框架搭建4.2.1新建工程打开uniapp的IDE编辑器HBuilderX，选择uni-starter项目模版，会自动生成项目。

文章插图
4.2.2初始化云服务空间首先，开通uniCloud：本项目是云端一体的，它的云端代码需要部署在uniCloud云服务空间里，需要开通uniCloud 。在https://unicloud.dcloud.net.cn/登录，按云厂商（阿里云或腾讯云）要求进行实名认证。
其次，绑定以及运行云服务空间初始化

文章插图

文章插图
4.2.3微信小程序相关配置4.2.3.1配置微信小程序基础信息在项目更目录manifest.json下，完成基础配置和微信小程序配置：

文章插图

文章插图
4.2.3.2配置登录（微信登录）信息uni-starter使用uni-id为开发者提供了开源、易用、安全、丰富、可扩展的用户管理框架。uni-id已完成的功能：
注册、登录、发送短信验证码、密码加密保存、修改密码、忘记密码、头像管理、token管理、rbac权限角色体系、页面访问权限路由控制、用户邀请裂变、用户签到、日志记录、账户防刷等。关于登录方式，目前已实现：
账户密码登录手机号+短信验证码登录（内置uniCloud短信能力）App手机号一键认证，免验证码（内置uni-app App一键登录能力）三方登录：App中的微信登录、Apple ID、QQ登录；微信小程序中的微信登录；支付宝小程序中的支付宝账户登录；QQ小程序中的QQ登录由于三方登录很多，在uni-id-co中留下了空实现，开发者可以自行补充、提交pr或发布扩展插件，共同完善uni-id 。
首先，配置登录方式：在更目录uni-starter.config.js下，配置登录方式；

文章插图
其次，在uniCloud->cloudfunctions->common->uni-config-center->uni-id->config.json下配置mp-weixinappid、appsecret ，以及登录过期时间等信息。

文章插图
4.2.3.3配置组件库组件是视图层的基本组成单元。组件是一个单独且可复用的功能模块的封装。uni-app的组件，分为基础组件和扩展组件。
基础组件
基础组件在uni-app框架中已经内置，无需将内置组件的文件导入项目，也无需注册内置组件，随时可以直接使用，比如<view>组件。扩展组件
uni-starter已经集成到uni_modules下，可以直接引用。也可以在插件市场引入第三方组件，例如uViewUI组件库。uViewUI组件库等插件市场的组件可以直接安装，无需手动安装：

文章插图
自定义组件
用户自定义的组件可以放在components目录下，不用引用、注册，直接在页面中使用。只要组件安装在项目的components目录下或uni_modules目录下，并符合components/组件名称/组件名称.vue目录结构。就可以不用引用、注册，直接在页面中使用。
4.2.3.4其他配置配置支付
unipay为uniCloud开发者提供了简单、易用、统一的支付能力封装。让开发者无需研究支付宝、微信等支付平台的后端开发、无需为它们编写不同代码，拿来即用，屏蔽差异。
uni-starter项目可在uniCloud->cloudfunctions->common->uni-config-center->uni-pay->config.js下配置：
const path = require('path')module.exports = {// 微信小程序端对应的微信支付及登录配置配置wxConfigMp: {appId: '',secret: '',mchId: '',key: 'r',},// App端对应的微信支付配置wxConfigApp: {appId: '',mchId: '',key: '',},// 微信PC网站支付wxConfigH5: {appId: '',mchId: '',key: ',},// 支付宝小程序端对应的支付宝支付及登录配置aliConfigMp: {mchId: "",appId: "",alipayPublicKey: "",privateKey: "",},// App端对应的支付宝支付配置aliConfigApp: {mchId: "",appId: "",alipayPublicKey: "",privateKey: "",}}