嘿！
我是 Ayaan，一不小心就成为了一名软件工程师。这并不完全在我的人生计划中，但我们来了！我的编码之旅以一种相当迂回的方式开始。我最初在 CAMP Systems International 担任用户体验设计师，主要任务是让仪表板看起来更漂亮。那时，除了用 Webflow 构建网站之外，我没有写太多代码。我对 HTML 和 CSS 的了解已经够多了，这很危险，但仅此而已。
几年前，我开始与另一家公司签订合同，从事通常的设计工作——小册子、网站、徽标，凡是你能想到的。但随后，他们向我抛出了一个难题：“嘿，你能帮助我们在 React 中开发一些 UI 组件吗？”此时，我还没有做过太多编程，所以我最初的反应是恐慌和“你确定要我这样做吗？”但他们是我作品的粉丝，坚持让我尝试一下。
该项目有一个简单的技术堆栈：一个使用 MUI、React 和 Redux 构建的仪表板。 React 相对容易上手，因为它与 HTML 相似，但 MUI 和 Redux 呢？他们很残酷。 Redux 是一个概念野兽，拥有减速器、中间件、thunk 等等。还有梅伊？感觉就像每次我构建一些东西时，我都会发现 MUI 已经有一个组件了。图书馆的庞大规模令人难以承受——直到我偶然发现了我最好的新朋友：副驾驶。
大约一年前，即我偶然进入软件工程职业生涯的一年，一位朋友建议我尝试 GitHub Copilot。起初，这很神奇。我会要求它编写代码，它会为我完成这一切。有几天，我感觉自己是这个星球上最有生产力的人。但后来新玩具效应逐渐消失，我意识到副驾驶并不完美。对于已成为我首选库的 MUI，它经常使用过时的文档。这是一个例子：
问题：“如何使面包屑 React 组件在添加 5 个项目后崩溃，但直到在 MUI 中添加至少 3 个项目后才崩溃？”
虽然这个答案看起来很合理，但快速浏览一下 MUI Breadcrumbs API 就会发现，只需几行代码即可完成：
从“反应”导入反应；
从“@mui/material”导入{面包屑}；
const CollapsibleBreadcrumbs = ({ items }) => {
返回 （
{项目}
）；
};
导出默认的 CollapsibleBreadcrumbs；
Copilot 遇到了困难，因为它缺乏必要的上下文来提供准确的答案。现有的解决方案试图解决这个问题。 Phind、SearchGPT 和 Perplexity 等产品试图通过索引互联网、使用向量数据库检索信息并向法学硕士提供该上下文来解决该问题。这些解决方案对于我的用例来说效果很好，但仍然存在使用过时的文档和属性幻觉等问题。
因此，我将尝试做一些不同的事情，而不是简单地重新发明轮子。我谦虚地认为，维护“知识库”应该是图书馆所有者（如 MUI 或其他图书馆）的责任。本质上是可以用自然语言建立索引和查询的资源集合。图书馆的文档将存在于其知识库中，但 GitHub 问题、源代码或常见问题等信息源也可以存在。最重要的是，查询此信息的接口将符合标准接口。
远大的愿望，我知道。更糟糕的是，我什至不知道这个界面会是什么样子。也就是说，我已尽力想出使用我最喜欢的库 MUI 的感觉！
她在这里：
由于我大量使用 MUI 库（以及对 GitHub copilot 的滥用），我决定创建一个 VS Code 聊天参与者。 VS Code / GitHub Copilot 中的此 @notation 允许扩展在接收提示之前进行 API 调用。基本上，我为 MUI 文档、问题、示例 GitHub 存储库以及将上下文注入副驾驶系统的其他来源构建了一个检索系统。这是我对使用 MUI 的“知识库”的产品的看法。这是它的技术流程：
- VS Code 向 MUI 知识库发出 API 请求
- Knowledge Repo 返回前 N 个最相似的向量嵌入
- 提示已制定并发送回 VS Code
- VS Code 进行调用并提示语言模型 API
- 🎉🎉 用户得到回复 🎉🎉
我真的很想赞扬 VS Code 和 GitHub 上致力于此聊天 API 的团队。按照 VS Code 的风格，它正在成为一个真正强大且可扩展的 API。我确实希望有一天我们可以在没有 Copilot 订阅的情况下使用聊天 API，但我真的很喜欢这个 API，并看到它的巨大潜力。
请随意使用下面的链接亲自尝试该扩展！
MUI VS 代码扩展
看看我在 Loom 中介绍的一些功能：
加强 MUI 开发 🚀 — 观看视频
免责声明
本文内容(图片、文章)翻译/转载自国内外资讯/自媒体平台。文中内容不代表本站立场，如有侵权或其它，请联系 admin@eiefun.com，我们会第一时间配合删除。