我正在参加「掘金·启航计划」
公众号「古时的风筝」，专注于后端技术，尤其是 Java 及周边生态。
大家好，我是风筝
其实很早之前就想学学 VSCode 插件开发了，但是又不知道做什么，加上我这半吊子前端水平，迟迟没有动手。
最近 ChatGPT 火的一塌糊涂，我也一直在用，真的非常好用，有些问题之前需要 Google 搜索，现在用 ChatGPT 基本上都能直接解决，效率提升了不少。
但是吧，浏览器和 IDE 来回切换又很麻烦，所以我灵机一动，那就开发个 ChatGPT 插件吧，即可以学习学习 VSCode 插件开发，又可以做一个方便的效率工具，岂不是一举两得，美哉美哉。
于是我就动手写了下面这个插件，叫做 mini ChatGPT，现在已经发布到 VSCode 插件市场了。
有条件的同学可以安装一下，试试效果如何。
插件功能特点
- 界面简洁，没有多余的干扰；
- 像 ChatGPT 官网输出效果一致，打字效果实时输出；
- 支持两轮上下文（太多了浪费 tokens），大致等于支持上下文；
- 代码美化+格式化，并且可以一键复制，直接粘贴到 vscode 中；
插件安装
当然了，这是需要科学上网的。
你可以直接在 VSCode 的商店直接搜索 mini ChatGPT安装。
也可以到应用市场上安装。
插件地址：marketplace.visualstudio.com/items?itemN…
插件使用
- 点击查看->命令面板，或者使用快捷键（MacOS: Shift + Command + P，Windows:Shift + Control + P
- 输入
Chat并回车。 - 如果是首次使用，会弹出提示输入框，在此输入 ChatGPT 的 API。使用的就是原滋原味的 ChatGPT API 接口，官网上都写的很清楚，所以需要使用插件的小伙伴提供自己账号的 API key。下面有介绍如何获取ChatGPT API key。
- 之后就可以使用啦
- 如果之后想更换 ChatGPT 的 API key，在命令面板中输入
ChatGPT API即可。
使用建议
此插件只有一个 webview 实现，打开之后独占一个 tab，可以设置向左或向右拆分，然后在左侧使用此插件向 ChatGPT 提问，右侧是代码文件，这样就不用来回切换了，而且可以将代码片段一键复制，然后直接运行。
获取 ChatGPT API key
开发历程
作为一个后端开发，我的前端水平是非常一般的，所以代码中有瑕疵的地方还请见谅。对了，代码已经放到 GitHub 上了。
VSCode 插件开发，官方建议是用 TypeScript 开发，所以项目完全采用了 TS 开发。由于功能比较简单，没有那么多复杂的设置，由于边学边做，太复杂的也没考虑。整个插件的核心其实就是一个 webview，在webview中实现界面布局和样式，难点就在于webview与插件本身来回的数据传递，但也都是常规用法。
整个写代码的过程其实也就几个小时，当然过程中的遇到的一些问题我都是跟 ChatGPT 提问的，包括样式都是直接描述需求，ChatGPT 给我一个大致的框架，我再微调一下就可以了。
所以这样看下来，其实是我和 ChatGPT 合作开发的。
后来发布到应用商店，写 readme 介绍和使用说明花了一些时间。
问题和建议
目前的版本功能比较简单，没有 ChatGPT 官方的聊天记录列表功能，如果真的有人用的话，后期考虑加上。
由于ChatGPT 官方并未提供上下文的 API 支持，所以只能采用其他方式模仿上下文能力，目前的做法是记录前两轮提问和回答，然后在下次提问的时候，将前两轮的提问和回答告诉 ChatGPT ，并且明确告诉 ChatGPT，例如下面这样。
第一轮问题：你好。
第一轮回答：你好，请问有什么要帮忙的吗？
第二论问题：请帮我写一段 Python 爬虫抓取知乎回答的 demo。
第二轮回答：好的，下面是一段抓取知乎回答的 Python 示例。....省略多行代码。
第三轮问题：帮我改成 Java 的。
这时候，我会将实际的 prompt 改成下面这样的。
下面中括号部分是前两轮的问题和回答，只用作参考。[my question is:"你好",your anwser is:"你好，请问有什么要帮忙的吗？".my question is:"请帮我写一段 Python 爬虫抓取知乎回答的 demo。",your anwser is:"好的，下面是一段抓取知乎回答的 Python 示例。....省略多行代码。".]
下面引号包含的这部分是真正的问题："帮我改成 Java 的。"
采用这种方式，几乎可以模拟上下文的操作，但是偶尔会出现错乱，这块儿还有优化空间，还会继续优化。
如果各位小伙伴使用过程中发现什么问题，或者有什么更好的建议，都可以直接跟我说。
也希望有收获的同学捧个场，转个发、点个在看，谢谢您嘞！我们下期再见。 公众号「古时的风筝」，专注于后端技术，尤其是 Java 及周边生态。文章会收录在 JavaNewBee 中，更有 Java 后端知识图谱，从小白到大牛要走的路都在里面。
