如何使用Novel
安装Novel: 通过在终端中运行'npm i novel'来在您的项目中安装Novel。
设置环境变量: 设置所需的环境变量:OPENAI_API_KEY用于OpenAI集成,BLOB_READ_WRITE_TOKEN用于Vercel Blob访问。
导入Novel组件: 在您的React代码中导入必要的Novel组件,例如EditorContent和EditorRoot。
创建编辑器组件: 创建一个使用Novel编辑器的组件,将EditorContent包裹在EditorRoot内。
配置初始内容: 使用EditorContent上的initialContent属性设置编辑器的初始内容。
处理内容更新: 使用EditorContent上的onUpdate属性处理编辑器内容的更改。
自定义外观: 使用Tailwind CSS类或您首选的样式方法自定义编辑器的外观。
实现AI功能: 通过配置OpenAI集成来利用AI驱动的自动补全功能。
添加额外功能: 根据项目需要实现额外的功能,如图像上传或协作编辑。
测试和完善: 彻底测试编辑器,并根据您的具体要求完善其功能和外观。
Novel 常见问题解答
Novel 是一个 Notion 风格的 WYSIWYG(所见即所得)编辑器,具有 AI 驱动的自动补全功能。它基于 Tiptap、OpenAI 和 Vercel AI SDK 构建。
查看更多