将 Nuxt Studio 模块添加到您的项目中：
pnpm add nuxt-studio@alpha
npm install nuxt-studio@alpha
yarn add nuxt-studio@alpha
bun add nuxt-studio@alpha
或者，使用 Nuxt CLI 自动添加模块：
npx nuxt module add nuxt-studio@beta
前面的步骤即可让您编辑内容。只需点击页面左下角的浮动按钮。
本地运行时，任何文件更改都会与本地文件系统实时同步。
Studio 的主要优势是可以直接从生产网站发布内容更改。此功能需要两个配置：
配置您的内容存储位置及提交变更的仓库：
配置用户认证方式以访问 Studio。可选择 GitHub、GitLab、Google OAuth，或自定义认证：
Nuxt Studio 需要服务器端路由来处理身份验证。
虽然通过 Nuxt 混合渲染 支持静态生成，但您的站点必须 部署在支持服务器端渲染（SSR） 的平台上，并使用 nuxt build 命令。
如果您想预渲染所有页面，可以使用如下配置：
export default defineNuxtConfig({
nitro: {
prerender: {
// 预渲染首页
routes: ['/'],
// 然后爬取页面上的所有链接
crawlLinks: true
}
}
})
将模块添加到您的 nuxt.config.ts 并配置 GitHub 仓库：
export default defineNuxtConfig({
studio: {
// Studio 后台管理路由（默认：'/_studio'）
route: '/_studio',
// GitHub 仓库配置（必须指定 owner 和 repo）
repository: {
provider: 'github', // 目前仅支持 GitHub
owner: 'your-username', // 您的 GitHub 用户名或组织
repo: 'your-repo', // 您的仓库名称
branch: 'main', // 提交的分支（默认：main）
rootDir: '' // 可选：如果您的 Nuxt 应用在子目录（默认：''）
}
}
})
rootDir 选项以指向正确的位置。Nuxt Studio 使用 GitHub OAuth 进行身份认证。
前往 GitHub 开发者设置，点击 New OAuth App（创建新的 OAuth 应用）
填写必填字段：
https://yourdomain.comhttps://yourdomain.comhttp://localhost:3000创建 OAuth 应用后，您将获得：
将 GitHub OAuth 凭据添加到您的部署平台的环境变量，或在本地的 .env 文件中添加：
# Example with GitHub OAuth
STUDIO_GITHUB_CLIENT_ID=<your_client_id>
STUDIO_GITHUB_CLIENT_SECRET=<your_client_secret>
默认情况下，Studio 会将更改提交到配置指定的分支（通常是 main）。但是，您可以配置 Studio 使用预发布或预览分支。
这对于您在合并到生产环境之前，在预览环境中审核更改非常有用。目前可以手动在 GitHub 上处理拉取请求，自动创建 PR 功能已经在规划中，将在未来版本中实现。
更新您的 nuxt.config.ts，指定使用预发布分支。
export default defineNuxtConfig({
studio: {
repository: {
owner: 'your-username',
repo: 'your-repo',
branch: PROCESS.ENV.STUDIO_GITHUB_BRANCH_NAME, // 使用预发布分支代替 main
}
}
})
配置您的托管平台将预发布分支部署到预览 URL（例如 staging.yourdomain.com）。
专门为预发布环境创建一个新的 OAuth 应用：
https://staging.yourdomain.comhttps://staging.yourdomain.com为预发布部署配置预发布 OAuth 凭据及分支名称：
STUDIO_GITHUB_CLIENT_ID=<your_staging_github_client_id>
STUDIO_GITHUB_CLIENT_SECRET=<your_staging_github_client_secret>
STUDIO_GITHUB_BRANCH_NAME=<your_staging_branch_name>
访问 https://staging.yourdomain.com/_studio 进行内容编辑。所有提交将推送到您配置的预发布分支。
当您对预发布分支上的更改满意后，创建来自预发布分支到主分支的拉取请求（PR），以部署到生产环境。
部署完成后，通过访问配置的路由（默认：/_studio）打开 Studio 界面：
Nuxt Studio 包含一个 实验性 的开发模式，支持实时文件系统同步：
export default defineNuxtConfig({
studio: {
development: {
sync: true // 启用开发模式
}
}
})
启用后，Nuxt Studio 会：
content/ 目录中的更改public/ 目录默认值: ''如果您的 Nuxt Content 应用位于 monorepo 或子目录中，请指定 rootDir 选项以指向正确的位置：
export default defineNuxtConfig({
studio: {
repository: {
...
rootDir: 'docs'
}
}
})
默认值: true默认情况下，Studio 会请求访问公共和私有仓库。
若设置 private: false，则 OAuth 认证范围仅限公共仓库，这在处理公共仓库时出于安全或合规考虑可能更合适：
export default defineNuxtConfig({
studio: {
repository: {
...
private: false
}
}
})
Nuxt Studio 内置多语言支持，当前可用语言包括：
通过在 nuxt.config.ts 中添加 i18n 选项来设置您偏好的语言：
export default defineNuxtConfig({
studio: {
i18n: {
defaultLocale: 'fr' // 可选 'en'、'fr' 或 'de'
}
}
})
语言包将翻译：
如果想在本地测试生产环境配置，请禁用开发模式：
export default defineNuxtConfig({
studio: {
dev: false
}
})
确保您配置的 OAuth 提供商的回调地址指向本地开发服务器（通常是 http://localhost:3000）。