Yao Copilot
A Visual Studio Code - ChatGPT Integration
转转 ZZ-UI 专属 vscode 插件!
特色
- ➕ 支持 zzui 组件自动导入
- 📖 内置业务开发常用的代码片段、方法
- 🌐 内置 zzui 官网，选中组件可直接打开对应文档
- 🌐 内置 GPT 4，无需openai-key、无需科学上网
- 💻 右键菜单即可选用功能，支持快捷键，无需输入命令
- 🚀 可以添加预定义提示词以便在提问的时候快速输入
- 📤 可以导出代码或整个会话为markdown文件
- 💾 可以将你的会话记录保存在本地硬盘，随时回放、继续和管理
- 🗣️ 支持流式上下文对话并且可以随时暂停回答
- 🔒 隐私安全，所有信息都保存在本地硬盘，不会将任何信息上传至任何服务器
命令
- ChatGPT:发起提问❓: 打开右键菜单，选中 🚀 启动 ChatGPT 即可发起任意提问
- ChatGPT:为什么这段代码出现了BUG?🐛💻: 使用查找代码错误功能来分析和突出代码中的错误
- ChatGPT:为我这段代码添加测试➕🧪💻: 使用解释代码功能来更好地理解您的代码
- ChatGPT:重构这段代码并告诉我你改动了哪里?🔧💻: 重构代码并清楚地了解您改变了什么
- ChatGPT:为我这段代码添加测试➕🧪💻: 为您的代码轻松添加测试
- ChatGPT:自定义提问✏️❓: 为ChatGPT生成自定义查询
- ChatGPT:增加预定义提示词➕: 添加预定义的提示词，使提问更加高效
- ChatGPT:修改显示语言🌍: 通过快捷键和命令来设置您想要的语言。默认是中文
- ChatGPT:清空列表🗑️: 可以清空当前的会话
- ChatGPT:导出markdown📤: 可以导出当前的会话为markdown文件
使用
安装扩展
从VSCode市场安装扩展
vscode插件搜索： zz-yao
向开发者获取 vsix文件离线安装
AI 能力
提问
- 点击左侧的转转熊图标，会打开 ChatGPT 面板，输入你想说的内容，按Enter键，等待几秒钟，ChatGPT的回复就会出现。
- 打开右键菜单，选中 🚀 启动 ChatGPT 即可
什么是API key？
OpenAI的API key是一种用于验证和授权访问OpenAI的API（应用程序编程接口）的机制。API key就像一个密码，允许开发者以安全的方式与OpenAI的服务进行交互。API key在建立服务器和客户端之间的连接中是一个关键因素，用于验证请求的合法性。通常，只有拥有有效API key的用户才能访问特定的API。 这一点开发者已经帮您解决，您直接使用即可！
为什么这段代码出现了BUG？🐛💻
打开任何文件，选择一段代码（如果没有选择代码，将会弹出提示），然后右键选择菜单中的🚀 为什么这段代码出现了BUG 。这可以帮助你分析代码并突出显示任何错误。
帮我解释这段代码？💬📖
打开任何文件，选择一段代码（如果没有选择代码，将会弹出提示），然后右键选择菜单中的🚀 帮我解释这段代。这可以帮助解释你的代码。
重构这段代码并告诉我你改变了什么？🔧💻
打开任何文件，选择一段代码（如果没有选择代码，将会弹出提示），然后右键选择菜单中的🚀 重构这段代码并告诉我你改变了什么。这可以帮助重构你的代码。
为我添加一些单元测试代码➕🧪💻
打开任何文件，选择一段代码（如果没有选择代码，将会弹出提示），然后右键选择菜单中的🚀 为我这段代码添加测试。这可以帮助为你的代码添加测试。
自定义问题✏️❓
打开任何文件，选择一段代码（如果没有选择代码，将会弹出提示），然后右键选择菜单中的🚀 启动 ChatGPT。会弹出一个输入框，输入你的问题，按Enter键，你就会得到答案。
增加预定义提示词➕
启动 ChatGPT 面板后，点击左下角的 提示词 可以添加导入提示词，也可以直接在线获取。获取之后在提问输入框可以键入/弹出预定义选择框，然后按上下方向键可以选择预定义提示词，回车或点击可以确定并自动填入提问输入框
设置语言🌍
启动 ChatGPT 面板后，在头像右侧可以看到 设置 按钮，点击打开设置面板，在 总览 中可以进行多语言设置
模型🧠
OpenAI API由一组具有不同功能和价格点的模型驱动。你也可以通过微调对我们的原始基础模型进行有限的定制，以适应你的特定使用场景。
GPT-3.5
GPT-3.5模型可以理解和生成自然语言或代码。在GPT-3.5系列中，我们最有能力和最具成本效益的模型是gpt-3.5-turbo，它已经针对聊天进行了优化，但也适合传统的完成任务。在2023年6月27日，gpt-3.5-turbo将从gpt-3.5-turbo-0301更新为gpt-3.5-turbo-0613。我们建议使用gpt-3.5-turbo而不是其他GPT-3.5模型，因为其成本更低，性能更好。
GPT-4
GPT-4是一个大型的多模型（接受文本输入并发出文本输出，将来可以接受图像输入），它可以比我们之前的任何模型更准确地解决困难的问题，这要归功于它更广泛的一般知识和先进的推理能力。像gpt-3.5-turbo一样，GPT-4针对聊天进行了优化，但也适合传统的完成任务，都使用Chat Completions API。
ZZUI支持
自动补全zzui组件
**触发方式：**在vue文件的template中键入 <z
效果： 提示zzui中的规范组件，和组件的相关介绍，如下图所示，按下回车，键入对应的组件，并附带组件的默认属性，并不是所有的组件都会有默认属性。如果当前没有引入相关的zzui组件，会在 script 中自动引入该组件并且自动use。
自动导入zzui
在选择zzui组件的时候，如果当前文件中没有引入zzui，将会自动导入zzui，并use ， 如果当前已经引入了，则会插入选中的新组件。
内置 ZZUI 官网
应用场景： 当在开发使用zzui的时候，某一个组件的属性不是很清楚的时候，但是又懒的打开zzui官网去查询某个组件的文档，此时可直接选中当前组件，在vscode内部直接打开zzui官网，并且定位到当前组件，方便查询。
触发方式： 选中组件，右击选择 search in zzui 或者 选中后使用快捷键： shift+cmd+l [shift+ctrl+l windows]
效果：
代码片段
基础片段
imna ==> 导入 import native from '@zz-common/native-adapter'
imfu ==> 导入 import { getQuery } from '@zz-platform/future'
improxy ==> 导入 const { proxy } = getCurrentInstance() as ComponentInternalInstance
f-ref ==> 导入 const componentRef = ref<InstanceType<typeof Component> | null>(null)
f-zzfetch ==> 导入 一个发起请求的函数模板
CSS片段
imel ==> 导入 @import '@zz-common/zz-ui/lib/style/mixins/ellipsis.scss';
inel ==> 导入 @include ellipsis();
inel2 ==> 导入 @include multi-ellipsis(2);
imha ==> 导入 @import '@zz-common/zz-ui/lib/style/mixins/hairline.scss';
inbd ==> 导入 @include border-1px(#ff483c, 10px);
模板片段
在vue文件中输入cvue 会看到一些 vue 的模板，包括简单模板和复杂模板、是否使用 ts 等，在进行新页面开发时推荐使用ts 版本的复杂模板
自定义设置
1、openai apiKey 配置
如果没有 apiKey 就不要进行配置，用系统的即可。如果有key，配置后可以无限使用
2、openai Model
openai 对应的模型，支持: gpt-3.5-turbo、 gpt-3.5-turbo-0301、gpt-3.5-turbo-0613、gpt-3.5-turbo-16k、gpt-3.5-turbo-16k-0613、gpt-4、gpt-4-0314、gpt-4-0613, 推荐使用 gpt-3.5-turbo、 、gpt-4
3、role 你希望AI担任的角色
会将这句话进行替换。
4、AI 问答的面板支持自定义配置
在侧边栏打开面板
在右侧打开面板
5、支持配置 zzui 官网链接
当 zzui 大版本更新后，插件会自动更新到最新版的文档地址
交流
有任何使用问题，均可联系 y170088888@163.com
