钉钉调试微应用整理2

5335ld

已于 2024-11-07 16:39:40 修改

阅读量744

点赞数 1

文章标签：钉钉前端

于 2024-11-07 11:43:06 首次发布

本文链接：https://blog.csdn.net/u014722196/article/details/143589812

版权

第一步新建应用

钉钉开放平台](https://open-dev.dingtalk.com/)
去新增应用

第二步配置应用信息

把本地代码运行起来，并设置本地地址
在这里插入图片描述

第三步在本地代码添加调试命令

这里有2中添加方式哪一种都可以
方式一：
index.html页面中

<!DOCTYPE html>
<html>
  <head>
  <!-- 用于调试 -->
		<script src='https://g.alicdn.com/code/npm/@ali/dingtalk-h5-remote-debug/0.1.3/index.js'></script>
 </head>
  <body>
    <div id="app">
	</div>
  </body>
</html>

方式二
npm引入dingtalk-h5-remote-debug包

npm install dingtalk-h5-remote-debug

在项目入口文件引入（如：APP.vue index.vue）

import { initDingH5RemoteDebug } from "dingtalk-h5-remote-debug";
initDingH5RemoteDebug();

第四步开始调试

在这里插入图片描述点击调试后
方式一：可以直接点击‘钉钉端内调试’，有可能钉钉会自动弹出，如果出现了调试按钮，就可以点击键盘上发F12进行调试了

方式二：点击复制路径，在钉钉内发送消息，在点击路径，钉钉才会弹出，我的这个没有出现调试按钮，但是点击键盘上发F12 还是可以调试（我属于第二种）
在这里插入图片描述
至此就完成了。
在这还可以看见连接调试的信息
此文章仅仅是用于记录

钉钉调试微应用整理2

第一步 新建应用

第二步 配置应用信息

第三步 在本地代码添加调试命令

第四步 开始调试

第一步新建应用

第二步配置应用信息

第三步在本地代码添加调试命令

第四步开始调试