IRONSOFTWAREHOME

使用提示文件在 VS 代码中更好地使用人工智能

使用提示文件在 VS Code 中更好地使用 AI

Tim Corey

13m 20s

Visual Studio Code 中的人工智能不再只是一个附加组件。 当您将 VS Code 的人工智能工具包视图与精心编写的提示文件相结合时,您就可以将常规开发任务转化为更快、更有条理的工作流程。 在他的视频"在 VS 代码中使用提示文件更好地使用人工智能"中,Tim Corey 展示了他是如何做到这一点的,并演示了在自己网站的代码库中使用人工智能模型的实际例子。

在本文中,我们将按照 Tim 的解释,重点介绍 vscode 人工智能提示、提示工程实践和聊天视图如何共同提供更可靠、更可重复的结果。

提示文件为何重要

0:00 时,蒂姆说:"与人工智能一起使用提示文件,可以将体验从一般变成出色。提示文件告诉人工智能模型如何思考、如何继续以及如何响应用户提示。 Tim 将其与微软公司 Burke Holland 的 "Beast Mode "文件联系起来,该文件是一个大型的系统提示,就像一个模板。 通过使用,开发人员可以减少重复指令,减少错误,并在 VS Code 中获得更可预测的生成代码。

Tim 将其视为一种提示工程:您正在构建一套可重复使用的说明,这样当您以后在聊天视图或活动栏上的人工智能工具包图标中输入快速用户提示时,人工智能已经知道您的编码风格和首选项目结构。

Tim 的开发人员资源

在展示工具之前,Tim(0:27)回顾了他提供的免费和付费资源--九门完整的课程、iamtimcorey.com上的第十门课程,Plus 还回答了开发人员的问题。 他强调,这些工具旨在帮助开发人员提高技能,建立更好的工作流程。 这就为 VS Code AI 提示文件的重要性奠定了基础:它是改进日常编码任务的现代实践的一部分。

在 VS 代码中设置野兽模式

1:22 时,Tim 进入 VS Code 的工具部分。 他已经安装了野兽模式,并在 "配置模式 "下进行了选择。他解释说,您可以打开 AI 工具包视图,从模型目录中浏览模型,然后创建一个新的自定义模式。 在他的示例中,您可以单击 "选择添加提示",为其命名为 "GitHub 聊天模式",然后粘贴文件内容(1:34)。 这将存储您的自定义系统提示,以便在您的工作区中随时使用。

Tim 的设置展示了如何将本地模型或云模型与您自己的提示生成器说明相结合。 所有内容都会整齐地放在 VS Code 根文件夹或其他存储文件夹中,方便以后重复使用。

在实际项目中使用人工智能

从 2:03 开始,Tim 在他的 VS Code 工作区中托管的实际网站项目上演示人工智能。 他打开了 "学习路径 "部分的代码--基本上是一个 Python/React 支持的网站--并显示了应用导航菜单。 他想调整箭头图标,在悬停时添加一个小动画(3:21)。

这是一个典型的开发人员场景:您有一些前端代码,您希望人工智能代理为您生成 CSS,而您又不想手写每一个细节。 在已加载提示文件的情况下,您的用户提示可以很简短,人工智能会根据上下文进行填充。

准备人工智能提示

在 3:38 处,Tim 使用 Windows Snipping Tool(Windows+Shift+S)截取了一张显示箭头的截图(3:45)。 这种视觉背景有助于人工智能。 然后,他在 4:43 时输入了一个自然提示:

"在我的导航菜单的学习路径部分下,当鼠标移到箭头上时,将箭头从 30° 旋转到水平方向,然后再将鼠标移回。 以下是目前的截图"。

蒂姆指出,他稍后可能会指定 CSS 的具体放置位置,但他会从以下提示开始测试 Beast Mode 的功能。

野兽模式的计划

6:00 时,Tim 解释说 Beast Mode 概述了一个工作流程:确定正确的选择器、添加 CSS 类、添加悬停效果,然后进行测试和验证。 它甚至将 CSS 放到了正确的 site.css 文件根目录之上(6:42)。 这展示了提示文件中的预定义模式--关于样式去向的 "规则"--是如何引导人工智能做出响应的。

Tim 称这是使用提示文件的 "重中之重":它增加了上下文,让人工智能在操作时就像知道您的项目结构一样,而无需您每次都重复完整的描述。

迭代和完善

当 Tim 在 6:54 检查网站时,生成的代码只影响了一个箭头,而且方向错误。 然后,他对 7:29 处的提示进行了改进,翻转了悬停效果并将其应用于所有箭头。

8:49 时,他注意到现在所有箭头都会同时旋转。 因此,他在 9:06 发送了另一条用户提示,告诉人工智能只对悬停的项目应用效果。 蒂姆在 9:38 时说:"你必须调整人工智能。 它并不总是做正确的事情"。

这是一个在聊天视图中进行提示工程的很好的例子。 您可以编辑、重复和保存您的提示,直到人工智能生成您想要的结构化输出。 由于提示文件已经提供了系统提示,因此每条新指令都只是一个小改进。

最终结果

到 9:52 时,Tim 确认动画现在可以按箭头工作:悬停时旋转,鼠标离开时重置。 他指出,您可以切换到浅色或深色主题,改变颜色,放慢过渡速度--只要您喜欢(10:02)。 关键是,人工智能帮他弄清了 SVG 变换并编写了 CSS(10:11)。

Tim 在 10:30-11:20 时解释说,您可以扩展 Beast Mode 或创建自己的提示生成器文件,以定义如何布局文件、如何处理代码格式或如何调用 Python 函数。 这样,您的日常提示就可以短得多,而且还能得到一致的答案。

审阅人工智能输出

11:50 时,Tim 提醒大家要经常查看人工智能的更改。 即使有受保护的提示文件和良好的实践,人工智能也有可能在错误的位置添加类或破坏您所需的依赖关系。 在他的例子中,人工智能只做了一些小的、合理的改动--在这里添加了一个 CSS 类,在那里添加了一行代码--但开发人员仍应检查改动日志,并在必要时进行完善。

Tim 最后指出,一旦有了自己喜欢的结果,就可以保存并重复使用。 这就是在 VS Code 中使用 AI 模型和提示文件的精髓:一个可重复的、一致的工作流程,将临时提示转化为类似 SDK 的可靠体验。

从 Tim Corey 演示中获得的启示

根据 Tim Corey 在 视频中的演示,我们可以看到 Visual Studio Code 中精心设计的提示文件是如何实现的:

  • 为人工智能模型提供一致的上下文,以便缩短提示时间。

  • 自动处理生成的代码、结构化输出和格式化。

  • 集成到您的工作区、活动栏和人工智能工具包中,让您可以轻松打开、测试和完善提示。

  • 允许您浏览模型,在本地模型或云之间切换,并无缝应用您的提示工程规则。

通过将规则存储在提示文件中,您就可以为人工智能提供一个可靠的代理脚本,让您专注于更高级别的开发任务,而不是重复相同的指令。

Earn More by Sharing What You Love

Do you create content for developers working with .NET, C#, Java, Python, or Node.js? Turn your expertise into extra income!

Let's Stay in Touch!

Join our newsletter, you’ll get exclusive access on article updates. We value your privacy

Key in blue circle

立即获取免费的 30 天试用版密钥

Your trial license will be sent to your email address

无任何限制。100% 解锁。无需信用卡。

bullet_checked无需信用卡或创建账户无任何限制。100% 解锁。无需信用卡。
  • Logo Aetna
  • Logo NASA
  • Logo GE
  • Logo Porsche
  • Logo USDA
  • Logo Qatar
Join Millions of Engineers who’ve tried IronPDF
获取您的无义务咨询
填写下面的表格或通过sales@ironsoftware.com
您的资料将始终保密。
深受全球数百万工程师信赖
Iron Software 的客户徽标
立即获取您的免费30 天试用密钥
无需信用卡或创建账户