TockDocs LogoTockDocs
AI coding agents: see /llms.txt for the full documentation index. Markdown version: /docs/manual/zh/getting-started/studio.md.
快速入门

Studio 模块

使用自托管的 Studio Web 编辑器直接在线上编辑您的 Nuxt Content 网站。

Nuxt Studio 模块是一个基于浏览器的界面,用于直接在线上编辑您的 Nuxt Content 网站。通过 GitHub、GitLab 或 Google 认证在您已部署的站点上访问,无需任何本地开发工具即可开始管理内容。

浏览 Nuxt Studio 文档,了解如何安装该模块。
Nuxt Studio 预览

Studio 编辑器让您可以在生产网站上完全通过浏览器管理内容。无需本地开发工具、Git 命令或终端访问。对于希望在熟悉环境中编辑和预览更改的内容团队来说,这是理想之选。

在线上为您的 Nuxt Content 网站进行可视化编辑

Nuxt Studio 为基于 Nuxt Content 的网站提供 直接在生产环境中的可视化编辑

Studio 最初作为独立的高级平台提供,现在是一个 免费、开源、可自托管的 Nuxt 模块。它使您的整个团队——开发人员和非技术编辑——都能在不离开实时网站的情况下安全地创建和更新内容。

现有功能

TipTap 可视化编辑器

富文本 Markdown 编辑器,完整支持 MDC 组件。

💻 Monaco 代码编辑器

用于 Markdown(MDC)、YAML 和 JSON 文件的高级代码编辑器,适合编辑原始代码。

📝 基于表单的编辑器

使用基于集合模式自动生成的表单来编辑 YAML、JSON 和 frontmatter。

🎨 Vue 组件属性编辑器

可视化界面,直接从编辑器编辑 Vue 组件属性。

🔄 实时预览

在您的生产网站上即时预览内容更改。

🔐 多提供商认证

使用 GitHub、GitLab 和 Google 进行安全的 OAuth 认证。

🔑 自定义认证

用于实现自定义认证流程的工具(密码、SSO、LDAP 等)。

📝 文件管理

content/ 目录中创建、编辑、重命名和删除内容文件。

🖼 媒体管理

集中式媒体库,支持 JPEG、PNG、GIF、WebP、AVIF、SVG 等格式。

🌳 Git 集成

直接从生产环境提交内容更改,并依赖 CI/CD 流水线进行部署。

🚀 开发模式

使用 Studio 界面直接从本地文件系统编辑内容和媒体文件。

🌍 国际化

完整的 i18n 支持,覆盖 17 种语言:AR、BG、DE、EN、ES、FA、FI、FR、ID、IT、JA、NL、PL、PT-BR、UA、ZH、ZH-TW。

即将推出的功能

📂 集合视图

从统一界面管理和浏览所有内容集合。

🖼 媒体优化

在编辑器内直接优化图像和媒体资源。

🤖 AI 内容助手

获取智能的 AI 驱动建议,改进和加速内容创作。

💡 社区驱动功能

有想法?分享您的反馈,帮助塑造 Nuxt Studio 的未来。

Copyright © 2026