如何让 ai 更好的理解 uniapp?

[lyxxxh2]

实现 stitch 导出的 html

claude4

---

一开始我以为是没文档原因。

• 之前让 claude 写 uniapp 的 scroll 一直写不出来
• 于是我下载:uniapp-scroll.md
• claude 就能完成需求了

我下载全部文档,还是没发修复,尺寸一样各种问题。

claude 写 uniapp 的,经常遇到按钮大的离谱吧。

莫非是微信小程序自带的样式,claude 没训练过?

deepseek 官网的 chat

基础布局没错。

这时候我想: uniapp 是国产的,国外模型训练少,还得用国内模型才行。

如果花钱的,效果会更好吧? 于是我去火山测试。

火山的 deepseekv3 和豆包

看到<script>包含<style>???

deepseekv3.1: 即使我跟他声明:tailwind css 需要转普通 css,他也不转。

• 似乎是为了节省 token 一样,但是火山里面的 是收费的啊。

最后我再去 deepseek 官网的 chat,开始变得垃圾 也一样乱答了。

[lemonTreeTop]

context7 有文档，试试呢

[EthanZhuXE2V]

uniapp 除了尺寸单位是 rpx ，其他和 vue 的写法差不多吧。直接让 ai 按照 vue 的写法输出。如果你遇到什么不符合预期的样式，有可能是 uniapp 的“特性”了，这种得去文档里翻，去他们的论坛里搜。

[zhonghao01]

deepseek R1/v3 写 vue 代码简直是一坨。

[retrocode]

可以考虑更换 uni-app x, 有官方出的 AI Rules, 可以提升一些效果, 你图里的这些感觉是生成内容全部用的 px 导致的, 你得让 ai 按 rpx 输出尺寸

https://doc.dcloud.net.cn/uni-app-x/tutorial/rules_mcp.html

[lyxxxh2]

https://i.ibb.co/svs8Wbjm/1q.png
加个`box-sizing: border-box;`就正常了。

我以为 claude 不认识`scroll-view`
https://i.ibb.co/5wxQL4m/ai.png

就像偷懒的感觉,他懂 就是不继续思考。

[lyxxxh2]

@lemonTreeTop
https://i.ibb.co/zVNXMDnc/mcp-c.png

用了 context7, 这次布局很不错。

[realpg]

专门编程的 AI 基本对 uniapp 的理解都很透彻了 你只需要告诉他这是个 uniapp 项目 你要编译哪些端就可以了
但是对 uniappX 不行 还是会瞎鸡儿写 应该是太新了 知识库没有

[lyxxxh2]

claude 不能一次性处理复杂逻辑。
我让它实现 ui,并请求接口 渲染页面。
页面乱七八糟的。
***
我只能单独让它先实现 ui 。

效果很不错,跟 ui 一模一样。
最后再让它对接接口。

cluade 肯定限制性能了。

[lyxxxh2]

绝对 tm 限制性能了。
刚刚让 cluade 改新页面。

***
提示词:
## ui 设计
docs/order_detail.html 是 ui 导出的 html,我需要你完美实现它。
由于 ui 用的 tailwindcss,因此你转换时需要注意。
要一模一样的,颜色设计 布局等等。
注意:
1. tailwindcss 在 uniapp 是不支持的 需要转换成普通 css
2. svg 在微信小程序也是不支持的,你 base64,用 background
***
结果:
1. 字体颜色他不管,全黑。
2. svg 转 image 全错。

我再次说:"颜色你没改一模一样 svg 也是没显示出来"
他就全改正常了,claude 想一次性改完,是不可能的。