微信小程序源码 - 北漂开车指南外地车线路规划

介绍

同名微信小程序北漂开车指南外地车线路规划源码，移除线上接口，改为本地mock。

GitHub代码地址 jinjing-route-plan-mp-opensource

线上小程序功能

1. 智能规划线路，不收费，不限次数
2. 显示摄像头信息
3. 规避摄像头

技术栈

Taro3 + Webpack5 + Vue3 + NutUI + TailwindCSS + Husky + json-server + 高德LBS接口

功能亮点

• 位置选择， 个人开发者无法使用微信自带的位置选择功能，所以需要自己实现

技术亮点

• 点位重叠算法： 线路、摄像头是否重叠
• 微信小程序自动发布
• nonce 防重放

运行

开发环境

• nodejs >= 18.x
• 推荐pnpm， 运行更迅速， npm，yarn 也行，但我没有测试
• 最新的微信开发者工具

配置key

1. 配置高德地图key

   1. 创建高德key
   2. 复制 .private-keys.example.ts 为 .private-keys.ts
   3. 复制刚才的高德key到 .private-keys.ts 对应变量中

2. 配置小程序代码上传密钥

   1. 创建小程序代码上传密钥
   2. 复制刚才的key到 ci-private.jinjing.key 中

启动命令

pnpm install # 安装依赖 pnpm run server # 启动mock服务，端口好3000 pnpm run dev #启动小程序

微信开发者工具导入项目，选择根目录即可，可以看到结果。

代码规范

强制使用huksy来格式化代码，避免不同机器上vscode配置不同导致代码格式不统一 如果husky提交有问题，可以先注临时释掉 .husky\pre-commit, 提交成功后再关闭注释

预览

贡献代码

• 欢迎提issue
• 欢迎提pr

开发群

加入独立开发微信群-二维码经常更新

开发问题记录

• pnpm run dev时候，components.d.ts会被一直编译，导致lint-staged反复失败，可以手动git add 所有文件（除了components.d.ts）
• run build:weapp 的NODE_ENV是生产，但run build:weapp -- -- watch就又是开发了，不过代码会压缩
• 小程序需要使用[email protected]，因为v4使用了原生的nodejs的random函数，小程序不支持

创建key

创建高德key

高德后台->我的应用->添加Key->服务平台:Web服务->确认->复制key

创建小程序代码上传密钥

小程序后台->开发管理->开发设置->小程序代码上传->小程序代码上传密钥

加入独立开发微信群-二维码经常更新