buyfakett/reference
1
0
Fork 0
mirror of https://github.com/jaywcjlove/reference.git synced 2025-06-16 12:11:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add github-copilot.md (#475)

Browse Source 
* Add GitHub Copilot documentation

* Add inline chat useful instruction
This commit is contained in:
jussker
2023-12-06 22:46:15 +08:00
committed by GitHub
parent d29ac4215c
commit bd9c837102
4 changed files with 602 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

596
docs/github-copilot.md Normal file
View File

@ -0,0 +1,596 @@
Github Copilot 备忘清单
===
这是开始使用 [Github Copilot](https://code.visualstudio.com/docs/editor/github-copilot) 的快速参考指南。
\* 校对、错误请指正。📮邮箱: <a href="mailto:jussker@outlook.com">jussker@outlook.com</a>
一、准备工作
----
### 1、账号注册
> 需要先拥有一个Github账号，并订阅Copilot。
事项 | 说明
:-|-
Github 账号 | [注册地址](https://github.com/signup)
订阅 Github Copilot | [订阅地址](https://github.com/features/copilot)
### 2、安装Vscode插件
<!--rehype:wrap-class=col-span-1 row-span-1-->
> 在扩展商店中搜索安装下面插件
插件名称 | 功能
:-|-
`GitHub Copilot`|编辑器中进行代码补全提示
`GitHub Copilot Chat`|插件栏可以与copilot对话
### 3、Vscode 中登陆 Github 账号
<!--rehype:wrap-class=col-span-1 row-span-1-->
- 安装后，点击右下角的 `GitHub Copilot` 插件图标，然后点击 `Sign in to GitHub` 登陆。
- 或者，点击工具栏中的 `Accounts` 图标，然后点击 `使用 Github 登陆以使用Github Copilot` 进行登陆。
### 4、Copilot 订阅方案
<!--rehype:wrap-class=col-span-2 row-span-1-->
方案 | 价格 | 特性
:-|-|-
Copilot Individual | 10美元/人/月 <br> (学生, 教师, 开源项目贡献者 免费) | 代码补全, 聊天机器人
Copilot Business| 19美元/人/月 |代码补全, 聊天机器人, 命令行工具, 安全漏洞筛查, 代码参考, 公共代码筛查, 知识产权, 企业安全与隐私保障
Copilot Enterprise| 39美元/人/月 | Business 特性 + 私有代码库的个性化聊天 + 文档搜索总结 + Git Pull Request 摘要 + 代码审查 + 模型微调
<!--rehype:className=show-header left-align-->
### 5、Copilot 使用入口
<!--rehype:wrap-class=col-span-1 row-span-1-->
|名称 | 描述 |
|-|-|
Inline Suggestions| 在编辑器中紧邻光标所在位置显示建议
Completions Panel| 在编辑器中展示完整的建议列表
Inline Chat| 在编辑器中紧邻光标所在位置发起对话
Editor Chat| 在编辑器中打开完整的对话界面
Silde Chat| 在编辑器的侧边栏打开对话界面
Quick Chat| 在顶部唤起对话界面
二、提示技巧
----
### 提示之禅
<!--rehype:wrap-class=col-span-1 row-span-1-->
> 你与 `copilot` 之间的关系，就是作家和插画师的关系。
> 你只有尽可能的全面、干练、清晰的描述你的故事(即 `上下文`)。
> `copilot` 才能根据你的故事画出精美的插画 (即 `代码` )。
### 提示技巧
<!--rehype:wrap-class=col-span-1 row-span-1-->
- 1⃣️ 提供上下文信息
- 2⃣️ 上下文可被预测
### 实战教程
- [Youtube GitHub Copilot Series](https://www.youtube.com/playlist?list=PLj6YeMhvp2S5_hvBl2SE-7YCHYlLQ0bPt)
- [Pragmatic techniques to get the most out of GitHub Copilot](https://www.youtube.com/watch?v=CwAzIpc4AnA)
- [How I used GitHub Copilot to build a browser extension](https://github.blog/2023-05-12-how-i-used-github-copilot-to-build-a-browser-extension/)
### 上下文信息的种类
<!--rehype:wrap-class=col-span-2 row-span-1-->
类型|说明
-|-
文件|Copilot会查看编辑器中当前和紧邻打开的文件。
注释|Copilot会根据紧邻的注释，为你的代码提供帮助和建议。如 docstring, 块注释, 行注释之类。
命名|良好的命名能帮助Copilot更好地理解你的代码，如函数名, 变量名, 文件名等
代码|Copilot会查看你的代码和它附近的代码，以生成帮助你的建议。
<!--rehype:className=show-header left-align-->
### 上下文：文件
> Copilot会查看编辑器中当前和紧邻打开的文件，以分析上下文并提供适当的建议。
---
> - 1、避免打开过多的文件，以便Copilot能够更好地理解你的代码。
> - 2、打开的文件尽量相关且有共性。
> - 3、如果是新项目，可以打开一些模版代码、数据文件以及参考文档等相关示例文件。以便Copilot能够更好地理解你的期望。等已经开发了一些代码后，这些示例文件就可以删除了。
### 上下文: 注释: 顶部注释
创建一个新文件时，在文件顶部添加注释，描述你的需求。这对 Copilot 很有帮助。
\* 下面说明将使用`...`表示copilot开始生成的位置
```python
# Download file from an URL and analyze its content
# Details:
# * Download the file from an URL
# * Save the downloaded files into `./download` folder
# * Use `filetype` of the file to specify how to parse
# * Filetype can be `.pdf`, `.html`, `.epub`, `.md` and `.txt`
# * Use NLP or OCR to get the file content
# * Tokenize the file content and get the statistics result
import ...
```
### 上下文: 注释: 行内注释
在每个函数上面或重要代码块的上面添加注释，以帮助 Copilot 了解你代码中的一些意图或问题。
\* 下面说明将使用`...`表示copilot开始生成的位置
函数上方添加注释说明
```python
# parse the JSON string into User object
def ...
```
---
代码添加注释说明
```python
# ...
api_sever = FastApi(...)
# starting the API Sever, enable ssl, bind to 8443 port
...
```
### 上下文: 注释: Docstring
<!--rehype:wrap-class=col-span-1 row-span-2-->
有时候当你已经拥有详细设计文档，但未编写功能代码时，可以直接使用 docstring 中的描述来让 copilot 生成代码。
```python
def send_email(to_address: Email, subject: str, content: HTML): -> StatusCode:
"""
Send email to specified address
Parameters
----------
to_address : Email
The email address to send to
subject : str
The email subject
content : HTML
The email content
Returns
-------
StatusCode
The sending result
"""
...
```
### 上下文: 注释: 提问
> 如果你不想切换到 copilot chat 时，注释也可以用于提问。
```python
# Q: What is the difference between `os.path.join` and `pathlib.PurePath`?
# A: ...
```
### 上下文: 注释: Todo
> 你也可以让 copilot 为你生成 `todo` 列表来评估工作量。
```python
# Parse the json file into a Talks object
# TODO:
# -[ ] 1. ...
```
### 上下文: 命名
> 你的命名应该足够明确以便于 Copilot 理解你的意图
#### bad case
```python
a = 60
def send(dict):
...
class data:
...
```
#### good case
```python
timeout = 60
def send_email(to_address: Email, subject: str, content: HTML): -> StatusCode:
...
class Email:
...
```
### 上下文: 代码: 代码示例
> 提供片段代码示例，以帮助 Copilot 更好地开始新的开发任务。
>
> - 使用的框架与库
> - 代码风格
> - 算法逻辑
```python
from typing import List
from typing import Optional
from sqlalchemy import ForeignKey
from sqlalchemy import String
from sqlalchemy.orm import DeclarativeBase
from sqlalchemy.orm import Mapped
from sqlalchemy.orm import mapped_column
from sqlalchemy.orm import relationship
class Base(DeclarativeBase):
pass
class User(Base):
__tablename__ = "user_account"
id: Mapped[int] = mapped_column(primary_key=True)
name: Mapped[str] = mapped_column(String(30))
fullname: Mapped[Optional[str]]
addresses: Mapped[List["Address"]] = relationship(
back_populates="user", cascade="all, delete-orphan"
)
def __repr__(self) -> str:
return f"User(id={self.id!r}, name={self.name!r}, fullname={self.fullname!r})"
# Email Address
...
```
### 上下文: 代码: 数据示例
> 提供片段数据示例，以帮助 Copilot 更好地开始新的开发任务。
>
> - 数据结构与类型
> - 命名
> - 值处理逻辑
```python
dailogs = [
{
"timestamp": "May 1, 2023 11:00:00",
"text": "Hello, World!",
"speaker": "Jack",
},
{
"timestamp": "May 1, 2023 11:01:00",
"text": "Hello, Copilot!",
"speaker": "Copilot",
},
]
# Parse the json object into `Dialog` object
...
```
三、快捷键
----
<!--rehype:body-class=cols-2-->
对于mac用户建议修改alt相关的快捷键，因为mac上的alt+字母键有可能被输入法使用了。若有自定义过输入法`keylayout`，则忽略这句话。
另外没有快捷键的命令，可以唤起`命令面板`后输入查询关键字筛选后执行。
### Github Copilot
<!--rehype:wrap-class=col-span-2 row-span-1-->
#### Copilot 中 Inline Suggestions 相关命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`editor.action.inlineSuggest.trigger`| 触发内联建议 | `alt+\` | `alt+\`
`editor.action.inlineSuggest.showPrevious`| 显示上一个内联建议 | `alt+[`| `alt+[`
`editor.action.inlineSuggest.showNext`| 显示下一个内联建议 | `alt+]`| `alt+]`
`editor.action.inlineSuggest.acceptNextWord`| 接受内联建议的下一个字 | `ctl+right`| `cmd+right`
`editor.action.inlineSuggest.commit`| 接受内联建议 | `Tab`| `Tab`
`editor.action.inlineSuggest.hide`| 隐藏内联建议 | `Esc`| `Esc`
`editor.action.inlineSuggest.acceptNextLine`| 接受内联建议的下一行 | - | -
<!--rehype:className=show-header wrap-text left-align-->
#### Copilot 中 Completions Panel 相关命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`github.copilot.generate`| 打开 `Completions Panel` | `ctrl+enter`| `ctrl+enter`
`github.copilot.acceptCursorPanelSolution`| 接受`Completions Panel`光标所在的建议 | `ctrl+/` | `ctrl+/`
`github.copilot.previousPanelSolution`| 查看上一个建议 | `alt+[`| `alt+[`
`github.copilot.nextPanelSolution`| 查看下一个建议 | `alt+]`| `alt+]`
<!--rehype:className=show-header wrap-text left-align-->
#### Copilot 中 其他命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`github.copilot.toggleCopilot`| 启用/禁用 Copilot 补全提示 | -| -
`github.copilot.collectDiagnostics`| 收集诊断信息 | -| -
`github.copilot.openLogs`| 打开日志窗口 | -| -
`github.copilot.sendFeedback`| 打开社区网站 | -| -
`github.copilot.signIn`| 登陆 | -| -
<!--rehype:className=show-header wrap-text left-align-->
### Github Copilot Chat
<!--rehype:wrap-class=col-span-2 row-span-1-->
#### Copilot Chat 中 Chat 相关命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`github.copilot.interactiveEditor.explain`|进行解释（选中内容或光标所在的文件)|-|-
`github.copilot.terminal.explainTerminalSelection`|对此进行解释(需要在终端中使用)|-|-
`github.copilot.terminal.explainTerminalSelectionContextMenu`|Copilot: 对此进行解释(需要在终端中使用)|鼠标右键菜单|鼠标右键菜单
`github.copilot.terminal.explainTerminalLastCommand`|对终端中最后一个命令进行解释(需要在终端中使用)|-|-
<!--rehype:className=show-header wrap-text left-align-->
#### Copilot Chat 中 Inline Chat 相关命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`inlineChat.start`|代码内聊天| - | -
`github.copilot.interactiveEditor.generate`|在此生成(在光标所在位置唤起inline chat的`/generate`功能)| - | -
`github.copilot.interactiveEditor.generateDocs`|生成文档| - | -
`github.copilot.interactiveEditor.generateTests`|生成测试| - | -
`github.copilot.interactiveEditor.fix`|修复此| - | -
<!--rehype:className=show-header wrap-text left-align-->
#### Copilot Chat 中 Quick Chat 相关命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`workbench.action.quickchat.toggle`|开启/关闭 Quick Chat|`shift+cmd+i`|`shift+cmd+i`
`github.copilot.terminal.suggestCommand`|建议终端命令|`ctrl+i`(仅在终端起作用)|`cmd+i`
<!--rehype:className=show-header wrap-text left-align-->
#### Copilot Chat 中 Editor Chat 相关命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`workbench.action.openChat.copilot`|打开编辑器聊天|-|-
<!--rehype:className=show-header wrap-text left-align-->
#### Copilot Chat 其他命令
| 命令 |说明 | 快捷键 | Mac 快捷键 |
|-|:-|:-|:-|
`github.copilot.interactiveSession.feedback`|打开github Issues|-|-
`github.copilot.debug.workbenchState`|日志工作台状态|-|-
`github.copilot.ghpr.applySuggestion`|为Github Pull Request提供代码建议|-|-
<!--rehype:className=show-header wrap-text left-align-->
四、Copilot Chat 的 Slash Commands 使用技巧
----
> 在聊天对话框中可以通过`/`开头的命令来与Copilot Chat进行交互。
### Slash Commands 示例
<!--rehype:wrap-class=col-span-1 row-span-1-->
#### Slash Commands 由四部分构成
|元素|说明|
|-|-|
|- Agent | 指定Agent, 符号为 `@`, 可选
|- Commands | 指定命令, 符号为 `/`, 可选
|- 变量 | 引用内容, 符号为 `#`, 可选
|- 用户输入的指令 | 可选
#### 例子
```
/explain def helloworld():...
@vscode /api 请解释 inlineChat.start 的作用
@workspace /explain def helloworld():...
在每一行代码末尾添加注释进行解释
```
#### Agent
| Agent |说明 |
|- |:-|
@vscode |vscode命令与插件的问题
@workspace|项目workspace相关的问题
### Inline Chat 的 Slash Commands
<!--rehype:wrap-class=col-span-1 row-span-1-->
---
> 通过命令 `inlineChat.start` 触发 `inline chat` 后使用
|命令 |说明 |
|- |:-|
/doc |在此添加文档注释
/explain |对选中的代码进行解释
/fix |修复此选中的代码
/tests |为选中的代码生成单元测试
---
> 通过命令 `github.copilot.interactiveEditor.generate` 触发
|命令 |说明 |
|- |:-|
/generate |在此生成, 该命令无法由用户输入
---
> 当然也可以直接选中区域，然后在inline chat中输入指令执行 copilot会对选中区域进行指令操作
|常用指令|
| - |
|在每一行代码末尾添加注释进行解释|
|使代码满足PEP484要求|
<!--rehype:className=show-header wrap-text left-align-->
### Silde Chat 的 Slash Commands
<!--rehype:wrap-class=col-span-1 row-span-2-->
> 通过命令 `workbench.action.chat.openInSidebar` 触发 `chat` 后使用
> 或点击侧边栏上的Copilot聊天按钮
> 在Chat输入框中还允许指定Agent(即环境)
#### Slash Commands
|命令 |说明 |
|- |:-|
/api |回答vscode扩展插件开发的问题
/explain |对选中的代码进行解释
/fix |修复此选中的代码
/new |创建新项目workspace
/newNotebook |创建新的Jupyter Notebook
/terminal |解释命令行里的命令
/tests |为选中的代码生成单元测试
/help |帮助说明
/clear |清除会话
### `/terminal`特有的变量, 以`#`号开头
> 仅在`/terminal`命令中可用
| 变量 |说明 |
|-|:-|
`#terminalLastCommand`|最后一次执行的终端命令
`#terminalSelection`|选中的终端命令
### 的 Slash Commands
<!--rehype:wrap-class=col-span-1 row-span-1-->
- Quick Chat 与 Chat 的 Slash Commands相同
- Editor Chat 与 Chat 的 Slash Commands相同
五、参数设置
----
打开vscode 命令面板, 输入`Preferences:Open Settings` 打开配置文件，在文件模式下配置相关参数.
完整参数说明可以查看 `copilot` 与 `copilot chat` 两个[插件目录](https://code.visualstudio.com/docs/editor/extension-marketplace#_where-are-extensions-installed)下的 `package.json` 文件获知。
### 完整配置参考
```json
// settings.json
{
// ...
"github.copilot.chat.welcomeMessage": "always",
"github.copilot.chat.localeOverride": "zh-CN",
"github.copilot.editor.enableCodeActions": true,
"github.copilot.editor.iterativeFixing": true,
"github.copilot.editor.enableAutoCompletions": true,
"github.copilot.enable": {
"plaintext": false,
"ini": false,
"markdown": true,
"*": true
},
"github.copilot.advanced": {
"length": 4000,
"inlineSuggestCount": 5,
"top_p": 1,
"temperature": "0.8",
"listCount": 10,
"stops": {
"*": [
"\n\n\n"
],
"python": [
"\ndef ",
"\nclass ",
"\nif ",
"\n\n#"
]
},
"debug.showScores": true,
"indentationMode": {
"python": false,
"javascript": false,
"javascriptreact": false,
"jsx": false,
"typescript": false,
"typescriptreact": false,
"go": false,
"ruby": false,
"*": true
}
}
// ...
}
```
### 参数说明
<!--rehype:wrap-class=col-span-2 row-span-1-->
#### 代理参数
|设置参数 |值类型|说明 |
|:--|:--|:--|
`"http.proxy"`| string |配置网络代理地址
#### Copilot Chat 参数
|设置参数 |值类型|说明 |
|:--|:--|:--|
`"github.copilot.chat.localeOverride"`| string | 设置Copilot本地语言
`"github.copilot.chat.welcomeMessage"`| string |Copilot Chat 是否显示欢迎语<br>`first`: 仅第一次启动时, `always`: 总是, `never`: 从不
#### Copilot 基本参数
|设置参数 |值类型|说明 |
|:--|:--|:--|
`"editor.inlineSuggest.enabled"`| boolean |启用内联建议
`"github.copilot.editor.iterativeFixing"`| boolean| 允许 Copilot 提供迭代修复建议
`"github.copilot.editor.enableAutoCompletions"`| boolean |允许 Copilot 提供自动补全
`"github.copilot.editor.enableCodeActions"`| boolean|允许 Copilot 代码操作建议,这些操作可能包括重构代码、优化代码结构、修复可错误等
#### 设置 Copilot 生效的文件类型
|设置参数 |值类型|说明 |
|:--|:--|:--|
`"github.copilot.enable"`| json |请将 `"*": true` 放到末尾 <br>[语言](https://code.visualstudio.com/docs/languages/identifiers)后设置 `false` 表示禁用copilot, 设置 `true` 表示启用
#### Copilot 高级参数
> github.copilot.advanced 可以控制模型参数，最终影响到代码生成. 其值为json
|设置参数 |值类型|说明 |
|:--|:--|:--|
`"length"`| integer | 生成的代码字数, 默认为 `500`
`"top_p"`| number | 控制模型候选范围，默认值为 `1`，值范围为`0.0~1.0`
`"temperature"`| string | 控制模型的创造性，默认值为 `""`，值越大越不可预测，值范围为`0.0~1.0`
`"inlineSuggestCount"`| integer | 内联提示的个数, 默认为`3`
`"listCount"`| integer | 控制`Completions Panel`中建议个数，默认为 `10`
`"stops"`| json | 控制模型代码生成时停止的标志，可以按[语言](https://code.visualstudio.com/docs/languages/identifiers)来控制
`"indentationMode"`| json | 指定[语言](https://code.visualstudio.com/docs/languages/identifiers)是否采用该语言的缩近模式，由此可能会与stops冲突，比如采用`\{\}`缩近时，设置该参数时需要综合考虑
`"debug.showScores"`| boolean | 在代码建议列表中显示每个建议的分数
<!--rehype:className=wrap-text -->
END... ENJOY YOURSELF
----
> 欢迎大家添加新内容，校对、错误请指正。📮邮箱: <a href="mailto:jussker@outlook.com">jussker@outlook.com</a>
参考来源
----
\[1\]: [GitHub Copilot in VS Code](https://code.visualstudio.com/docs/editor/github-copilot)
\[2\]: [How to use GitHub Copilot: Prompts, tips, and use cases](https://github.blog/2023-06-20-how-to-write-better-prompts-for-github-copilot/)
\[3\]: [GitHub Copilot Official Website](https://github.com/features/copilot)
\[4\]: [GitHub Copilot Series (Youtube)](https://www.youtube.com/playlist?list=PLj6YeMhvp2S5_hvBl2SE-7YCHYlLQ0bPt)
\[5\]: [Pragmatic techniques to get the most out of GitHub Copilot (Youtube)](https://www.youtube.com/watch?v=CwAzIpc4AnA)
\[6\]: [How I used GitHub Copilot to build a browser extension](https://github.blog/2023-05-12-how-i-used-github-copilot-to-build-a-browser-extension)
\[7\]: [Visual Studio Code, Where are extensions installed?](https://code.visualstudio.com/docs/editor/extension-marketplace#_where-are-extensions-installed)
\[8\]: [Visual Studio Code, Language Identifiers](https://code.visualstudio.com/docs/languages/identifiers)