Tech
[分享创造] 开源个小插件:直接在浏览器中批注 UI 修改内容,本地 Claude Code 实时修改
最近用 Claude Code 调前端 UI 细节的时候,经常遇到一个挺烦的小问题:
需要费劲写一段 prompt 去告诉它:到底要改页面上的哪里。
比如这种需求:
“右下角最后一个卡片里的那个按钮小一点”
“中间那段文字,左边跟上面的标题对齐一下”
页面简单的时候还好,但一旦有重复卡片、嵌套组件或者布局稍微复杂一点,CC 还容易理解偏。
所以我做了个小工具,PinFix ( Pin it, Fix it )
它的思路很简单:
直接在本地运行的前端页面上,点一下你想改的地方,留一句批注,然后把这条批注和对应的源码位置一起交给你本地的 Claude Code 。
用起来大概是这样:
按 Alt + Shift + Z 进入批注模式
点一下页面上想改的地方,写一句批注
PinFix 会把「批注 + 源码位置」一起整理出来
再交给 Claude Code 去改代码
改完之后,HMR 直接就能看到效果
这样调整样式完全不需要离开浏览器,体验更丝滑~
它是一个前端开发环境插件,目前支持:
Vite
Webpack...
Read the full discussion on V2EX
This article was aggregated from V2EX. Click to join the conversation.
View on V2EX