代码编辑器

Codeium React Code Editor是一个免费的开源代码编辑器,作为React组件,无限的AI自動完成. 球队带给你的 编码。 。 。 . 无需账户即可免费.你只需要安装国家防范机制的软件包 放到你的网站上就行了!

特征

• 无限制 AI 自动完成( 不需要账户)
• 自定义 API 从 摩纳哥反应

演示

看看这个 这里来啊!

开始

使用其中任何软件包管理器安装

# NPM
npm install @codeium/react-code-editor

# Yarn
yarn add @codeium/react-code-editor

# PNPM
pnpm install @codeium/react-code-editor

现在导入 CodeiumEditor 享受闪电快的AI自动完成,直接在您的浏览器中,100%免费!

import { CodeiumEditor } from "@codeium/react-code-editor";

export const IdeWithAutocomplete = () => {
  return (
    <div>
      <p>Here's an AI-powered Python editor using Codeium.</p>
      <CodeiumEditor language="python" theme="vs-dark" />
    </div>
  );
};

以下是使用多文档上下文提供更智能化的自动补全的先进例子:

import { CodeiumEditor, Document, Language } from "@codeium/react-code-editor";

export const JavaScriptEditorWithContext = () => {
  const html = `<html>
  <body>
    <h1>Contact Us</h1>
    <form>
      <label>Name:</label>
      <input id="name" type="text" />
      <label>Email:</label>
      <input id="email" type="text" />
    </form>
  </body>
</html>`;

  return (
    <div>
      <p>This editor has context awareness of a neighboring HTML file and can provide better autocompletion suggestions.</p>
      <CodeiumEditor
        language="javascript"
        theme="vs-dark"
        otherDocuments={[
          new Document({
            absolutePath: "/app/index.html",
            relativePath: "index.html",
            text: html,
            editorLanguage: "html",
            language: Language.HTML,
          }),
        ]}
      />
    </div>
  );
};

注意 otherDocuments prop有10个文件的限制. 在这些文件中,Codeium将在幕后运行一个重新排名器,以优化符号限制中包含的内容.

实例

以下是生产中使用的Codeium React编辑器的一些实例:

• https://khou22.com/programming/codeium (中文(简体) ) [曲线[ . ]

如何运作

这个项目是一个围绕微软摩纳哥编辑器的包装器,它是授权VS代码的编辑器,具有提供代码自动补全的扩展能力.

自动完成是通过分析编辑的内容、预测和根据这一背景提出建议提供的。 要了解更多 如何完成自动补全,访问 密码的FAQ。 。 。 .

什么是可乐

编码 是免费的,AI动力的开发者工具包,可以插入70+ IDEs,包括:Visual Studio代码,JetBrains IDEs,Google Colab,和Vim. Codeium提供无限的AI上下文意识自动完成,聊天助手,智能搜索,代码库索引等功能. Codeium还提供在你的VPC或Prem上,空出环境中的灵活部署. 学习更多 codium.com (英语)。 。 。 .

API 密码

编辑器的核心API与被包裹的项目相同. 您可以查看编辑器 API 这里。 。 。 .

财务问题

我如何导入这个无害环境管理版本?

要导入此的无害环境管理版本, 您可以使用 import { CodeiumEditor } from "@codeium/react-code-editor/dist/esm";。如果您正在使用 TypeScript, 您的编辑器可能会警告这些类型缺失 。 目前的工作是:

• 创建一个 codeiumeditor.d.ts 文档,
• 添加 declare module '@codeium/react-code-editor/dist/esm'; 转到文件
• 使用 CodeiumEditor 组件.

就支持共同联合体系和无害环境管理而言,这是一个未决问题。 如果你有兴趣贡献 并有一个固定这一点, 拉请求是欢迎的.

鸣谢

没有这个计划是不可能实现的 Suren Atoyan的摩纳哥反应项目。 。 。 .

问题

在此寄存器中创建任何与自动补全功能相关的问题 。 如果您对编辑器 API 或功能有任何问题, 请在 编辑器仓库。 。 。 .

许可证

许可证