使用Taro从零搭建钉钉小程序的步骤
1. 安装Taro CLI
注意: 必须3.x版本,首先需要全局安装Taro开发工具:
css
npm install -g @tarojs/cli@3.x
2. 创建新项目
使用以下命令创建Taro项目,选择钉钉小程序模板:
csharp
taro init my-dingtalk-app
- 选择模板(如React/TypeScript)
- 安装依赖,使用 Taro 插件能支持编译钉钉小程序,插件文档请看 Github。
sql
cd my-dingtalk-app
npm install @tarojs/plugin-platform-alipay-dd --save
或
yarn add @tarojs/plugin-platform-alipay-dd
npm install
3. 配置钉钉小程序编译环境
修改config/index.js
添加编译脚本:
php
export default defineConfig(async (merge, { command, mode }) => {
const baseConfig = {
// ...
mini: {
webpackChain(chain) {
// 钉钉小程序特有配置
chain.merge({
plugin: {
install: {
plugin: require('terser-webpack-plugin'),
args: [{
terserOptions: {
compress: true, // 默认使用terser压缩
mangle: true
}
}]
}
}
})
}
},
dd:{
appid: 'xxx', // 从钉钉开放平台获取
},
// ...
}
})
修改package.json
添加编译脚本:
json
"scripts": {
"dev:dd": "taro build --type dingtalk --watch",
"build:dd": "taro build --type dingtalk"
}
4. 获取钉钉小程序AppID
- 登录钉钉开放平台
- 创建 企业内部应用,选择「小程序」类型
- 在应用详情页获取
MiniAppId
和CorpId
5. 配置项目AppID
新增project.dd.json
配置文件
perl
{
"miniprogramRoot": "./dist",
"appid": "xxx,
"projectname": "my-dingtalk-app",
"description": "Taro钉钉小程序项目",
"setting": {
"urlCheck": false,
"es6": false,
"postcss": false,
"minified": false
}
}
6. 开发与调试
- 启动开发服务器:
arduino
npm run dev:dd
- 打开支付宝开发者工具,选择「钉钉小程序」模式
- 导入项目编译目录(通常在
dist
)
7. 构建与发布
arduino
npm run build:dd
- 在钉钉开放平台完成版本发布流程
注意:钉钉小程序基于支付宝小程序框架,Taro通过编译为支付宝小程序类型实现兼容。开发过程中需注意钉钉特有API的调用方式。