相信作为一个程序员 + 股民,每天都有同一个痛点:
看股票要切屏。
打开网页看行情,老板路过以为我在摸鱼;用手机看,低头抬头脖子疼。能不能直接在看代码的地方看股价?毕竟 VSCode 才是程序员真正的"工位"。
于是我决定:做一个 VSCode 插件,把股价钉在底部状态栏。
但我没打算自己写------我让 AI 帮我写。
过程:我只说了几句话
第一句话:描述需求
"帮我生成一个可以实时查看股票价格的 VSCode 插件,具有以下功能:1、配置股票代码显示股价,可以配置多个;2、在底部栏显示。"

我用的是阿里的Qoder,就这么一句话。AI 开始干活了。
不到两分钟,项目骨架就搭好了:
-
package.json --- 插件清单,包含配置项、命令注册、激活事件
-
tsconfig.json --- TypeScript 编译配置
-
src/extension.ts --- 核心代码:腾讯财经 API 拉数据、状态栏渲染、定时刷新
-
.vscode/launch.json --- F5 一键调试
我甚至没告诉它用哪个 API,它自己选了腾讯财经的 qt.gtimg.cn,免费、稳定、不用注册。
第二句话:加个配置界面

插件跑起来后,我发现每次改股票都要去 JSON 配置文件里手敲代码,太不优雅了。
"能不能把配置股票也做到配置界面上?"
AI 二话不说,生成了一个完整的 Webview 配置面板:
-
股票列表的增删改查
-
自定义确认弹窗(因为 VSCode 的 webview 不支持原生 confirm())
-
刷新间隔设置
-
涨跌幅显示开关
-
适配 VSCode 深色/浅色主题
点击底部状态栏的股价,直接弹出配置面板。这个交互,比我自己想的还周到。
第三句话:修复中文乱码
跑起来后发现股票名称全是乱码。我截图告诉 AI:
"这个是乱码。"
AI 立刻定位到原因:腾讯 API 返回的是 GBK 编码,Node.js 默认按 UTF-8 解析,中文必然乱码。
它先尝试了 TextDecoder('gbk'),但在 VSCode 的 Electron 环境里这个 API 对 GBK 支持不稳定。最后用 iconv-lite 纯 JS 库完美解决,零依赖、跨平台、稳定可靠。
最终成品

这里是用trae测试,把股票名字修改一下,隐藏涨幅,只显示价格,是不是很隐秘
支持的市场
-
🇨🇳 沪市:sh600519(贵州茅台)
-
🇨🇳 深市:sz000001(平安银行)
-
🇭🇰 港股:hk00700(腾讯控股)
我的感受
AI 编程真正改变的不是速度,是门槛
以前做 VSCode 插件,我得先去翻官方文档:怎么注册命令、怎么写 package.json 的 contributes、Webview 怎么通信、StatusBarItem 的 API 是什么......
现在,我只需要知道我要什么。
AI 擅长的事
你仍然需要做的事
你从"写代码的人"变成了"审代码的人"。
如何使用这个插件
# 克隆项目
git clone <项目地址>
cd stock_unit
# 安装依赖
npm install
# 编译
npm run compile
# 打包
npm run package
# 安装到你的 VSCode,或者手动添加插件
code --install-extension stock-unit-1.0.0.vsix --force
重启 VSCode,底部状态栏就会出现股票行情。

按 Ctrl+Shift+P → Stock Unit: 打开配置面板或者点击下方股票名称,添加你关注的股票。
写在最后
这个插件从需求到成品,我和 AI 总共对话了不到 10 轮。
它不是玩具------我现在每天都在用它。
AI 编程不是替代程序员,而是让程序员可以把精力放在真正重要的事情上。
比如,研究下一只该买的股票。
如果这个项目对你有帮助,欢迎点赞、在看、转发三连 👍
项目已开源,源码见:https://gitee.com/moreairmore/stock_unit
可以在gittee上下载stock-unit-1.0.0.vsix安装