发表日期:2019-11 文章编辑:小灯 浏览次数:6274
基于Taro + Taro-ui + 微信云开发 初步实现了一个小程序
首先,你需要使用 npm 或者 yarn 全局安装@tarojs/cli,或者直接使用npx:
# 使用 npm 安装 CLI
$ npm install -g @tarojs/cli
# OR 使用 yarn 安装 CLI
$ yarn global add @tarojs/cli
# OR 安装了 cnpm,使用 cnpm 安装 CLI
$ cnpm install -g @tarojs/cli
taro init taro-timer
wxcloud
模板)
为区分开发环境及线上环境,需申请两个云资源环境,如:dev-id
和pro-id
,分别用于开发环境及线上环境。然后修改以下文件进行适配。 微信云开发官方文档
修改小程序项目配置文件 project.config.json
, 如:
// 注意:只有填写开通云开发后的appid, 微信小程序开发者工具中才会显示`云开发`按钮
{
"miniprogramRoot": "client/dist/", // 小程序项目文件(taro编译后的)
"cloudfunctionRoot": "cloud/functions/", // 小程序对应的云函数
"projectname": "taro-timer",
"description": "时间节点",
"appid": "************", // 小程序的appid
"setting": {
"urlCheck": true,
"es6": false,
"enhance": false,
"postcss": false,
"minified": false,
"newFeature": true,
"coverView": true,
"nodeModules": false,
"autoAudits": false,
"uglifyFileName": false,
"checkInvalidKey": true,
"checkSiteMap": true,
"uploadWithSourceMap": true,
"babelSetting": {
"ignore": [],
"disablePlugins": [],
"outputPath": ""
},
"bundle": false
},
"compileType": "miniprogram",
"simulatorType": "wechat",
"simulatorPluginLibVersion": {},
"cloudfunctionTemplateRoot": "cloudfunctionTemplate",
"condition": {}
}
修改Taro编译设置,用于区分开发环境及线上环境。
// client/config/dev.js 开发环境
module.exports = {
env: {
NODE_ENV: '"dev-id"' // 申请的微信小程序云开发资源id
},
defineConstants: {
},
weapp: {},
h5: {}
}
// client/config/prod.js 线上环境
module.exports = {
env: {
NODE_ENV: '"release-id"' // 申请的微信小程序云开发资源id
},
defineConstants: {
},
weapp: {},
h5: {}
}
项目入口文件 app.jsx
适配开发环境,区分开发及线上环境。
componentDidMount() {
if (process.env.TARO_ENV === 'weapp') {
Taro.cloud.init({
env: process.env.NODE_ENV,
traceUser: true
})
}
}
云函数配置 关于常量DYNAMIC_CURRENT_ENV
// 云函数入口文件
const cloud = require("wx-server-sdk");
cloud.init({
env: cloud.DYNAMIC_CURRENT_ENV
});
顺利的话,此时于client文件夹下执行npm run dev:weapp
和 npm run build:weapp
会分别调用相应环境的云函数。
日期:2019-11 浏览次数:5297
日期:2019-11 浏览次数:11745
日期:2019-11 浏览次数:4139
日期:2019-11 浏览次数:5137
日期:2019-11 浏览次数:5108
日期:2019-11 浏览次数:6926
日期:2019-11 浏览次数:5013
日期:2019-11 浏览次数:15541
日期:2019-11 浏览次数:4483
日期:2019-11 浏览次数:6273
日期:2019-11 浏览次数:5108
日期:2019-11 浏览次数:4365
日期:2019-11 浏览次数:10453
日期:2019-11 浏览次数:8111
日期:2019-11 浏览次数:4838
日期:2019-11 浏览次数:4100
日期:2019-11 浏览次数:8715
日期:2019-11 浏览次数:4433
日期:2019-11 浏览次数:4602
日期:2019-11 浏览次数:4661
日期:2019-11 浏览次数:4236
日期:2019-11 浏览次数:4805
日期:2019-11 浏览次数:10039
日期:2019-11 浏览次数:5192
日期:2019-11 浏览次数:5142
日期:2019-11 浏览次数:4651
日期:2019-11 浏览次数:12050
日期:2019-11 浏览次数:7145
日期:2019-11 浏览次数:7648
日期:2019-11 浏览次数:4706
Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.