YiXuan

浙政钉开发

浙政钉 H5 应用开发实用技巧，涵盖 VConsole 调试工具集成、企业级应用路由权限管理等常见场景的解决方案以及开发踩坑经验。

H5 应用 Console 调试功能

浙政钉 H5 应用开发中，为了方便调试，可以在页面中加入 VConsole 调试工具，方便查看日志、调试代码。

vConsole 是一个轻量、可拓展、针对手机网页的前端开发者调试面板

pnpm add vconsole

npm install vconsole

import VConsole from 'vconsole'

const vConsole = null

// 当鼠标按下中键时，显示vConsole，结束后销毁
document.addEventListener('keydown', (e) => {
  if (e.keyCode === 123) {
    if (!vConsole)
      vConsole = new VConsole()
    else if (vConsole)
      vConsole.destroy()
  }
})

const vConsole = null
const pressTimer = null

function handleTouchStart() {
  pressTimer = setTimeout(() => {
    if (!vConsole)
      vConsole = new VConsole()
    else if (vConsole)
      vConsole.destroy()
  }, 3000) // 长按时间阈值
}

function handleTouchEnd() {
  clearTimeout(pressTimer)
}

浙政钉应用埋点

浙政钉埋点文档

埋点需要三个参数:

sapp_name ：应用标识
bid ：sapp_name_zzdpro
sapp_id ：应用ID（可以去浙政钉支持群咨询）、官网查看埋点参数

app/permission.ts

import aplus_push from './gdt_aplus'

router.beforeEach(async (to, from, next) => {
  if (token) {
    /** 开始埋点 */
    const { meta: { title }, path, fullPath } = to
    const pageId = (path.replace('/', '') || 'app').toUpperCase()
    const userId = userStore.getUserInfo()?.dingId
    aplus_push(pageId, title as string, fullPath, userId)
    /** 结束埋点 */
  }
})

故障排查

部署过程中常见问题及解决方案

GitLab CI/CD 完全指南

一份涵盖从入门、配置到问题排查的完整 CI/CD 实践文档，实现快速上手并高效利用自动化流水线。