跳转到内容
StudioCMS 文档
主站点

StudioCMS 配置

可用配置选项

Section titled “可用配置选项”

有两种方式配置 StudioCMS 集成。以下示例展示了如何在 astro.config.mjs 文件或专用的 studiocms.config.mjs 文件中进行配置。

本页面展示如何定义 StudioCMS 配置及其位置。有关配置选项的完整参考，请查看配置参考文档。

使用 astro.config.mjs 文件

Section titled “使用 astro.config.mjs 文件”
astro.config.mjs
import 
function db(): AstroIntegration[]
db from '@astrojs/db';
import 
function node(userOptions: UserOptions): AstroIntegration
node from '@astrojs/node';
import 
const studioCMS: (options?: {
    sdk?: boolean | {
        cacheConfig?: boolean | {
            lifetime?: string | undefined;
        } | undefined;
    } | undefined;
    dbStartPage?: boolean | undefined;
    imageService?: {
        cdnPlugin?: "cloudinary-js" | undefined;
    } | undefined;
    defaultFrontEndConfig?: boolean | {
        htmlDefaultLanguage?: string | undefined;
        htmlDefaultHead?: {
            tag: "link" | "title" | "base" | "style" | "meta" | "script" | "noscript" | "template";
            attrs?: Record<string, string | boolean | undefined> | undefined;
            content?: string | undefined;
        }[] | undefined;
        favicon?: string | undefined;
        injectQuickActionsMenu?: boolean | undefined;
    } | undefined;
    dashboardConfig?: {
        dashboardEnabled?: boolean | undefined;
        inject404Route?: boolean | undefined;
        faviconURL?: string | undefined;
        dashboardRouteOverride?: string | undefined;
        AuthConfig?: {
            providers?: {
                github?: boolean | undefined;
                discord?: boolean | undefined;
                google?: boolean | undefined;
                auth0?: boolean | undefined;
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string;
                username ...
StudioCMS Integration


A CMS built for Astro by the Astro Community for the Astro Community.
@see ― The GitHub Repo: withstudiocms/studiocms for more information on how to contribute to StudioCMS.
@see ― The StudioCMS Docs for more information on how to use StudioCMS.
studioCMS from 'studiocms';
import { 
function defineConfig<const TLocales extends Locales = never, const TDriver extends SessionDriverName = never, const TFontFamilies extends FontFamily[] = never>(config: AstroUserConfig<TLocales, TDriver, TFontFamilies>): AstroUserConfig<TLocales, TDriver, TFontFamilies>
See the full Astro Configuration API Documentation
https://astro.build/config
defineConfig } from 'astro/config';


export default 
defineConfig<never, never, never>(config: AstroUserConfig<never, never, never>): AstroUserConfig<never, never, never>
See the full Astro Configuration API Documentation
https://astro.build/config
defineConfig({
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.site?: string
@name ― site
@type ― {string}
@description 
Your final, deployed URL. Astro uses this full URL to generate your sitemap and canonical URLs in your final build. It is strongly recommended that you set this configuration to get the most out of Astro.


{
  site: 'https://www.my-site.dev'
}
site: 'https://demo.studiocms.dev/',
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.output?: "server" | "static"
@name ― output
@type ― {('static' | 'server')}
@default ― 'static'
@see ― adapter *
@description 
Specifies the output target for builds.


    

  • 'static' - Prerender all your pages by default, outputting a completely static site if none of your pages opt out of prerendering.
    • 

  • 'server' - Use server-side rendering (SSR) for all pages by default, always outputting a server-rendered site.
    • 



import { defineConfig } from 'astro/config';


export default defineConfig({
  output: 'static'
})
output: 'server',
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.adapter?: AstroIntegration
@name ― adapter
@see ― output *
@description 
Deploy to your favorite server, serverless, or edge host with build adapters. Import one of our first-party adapters for Netlify, Vercel, and more to engage Astro SSR.


See our On-demand Rendering guide for more on SSR, and our deployment guides for a complete list of hosts.


import netlify from '@astrojs/netlify';
{
  // Example: Build for Netlify serverless deployment
  adapter: netlify(),
}
adapter: 
function node(userOptions: UserOptions): AstroIntegration
node({ 
UserOptions.mode: "standalone" | "middleware"
Specifies the mode that the adapter builds to.


    

  • 'middleware' - Build to middleware, to be used within another Node.js server, such as Express.
    • 

  • 'standalone' - Build to a standalone server. The server starts up just by running the built script.
    • 

mode: "standalone" }),
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.integrations?: (false | AstroIntegration | (false | AstroIntegration | null | undefined)[] | null | undefined)[]
@name ― integrations
@description 
Extend Astro with custom integrations. Integrations are your one-stop-shop for adding framework support (like Solid.js), new features (like sitemaps), and new libraries (like Partytown).


Read our Integrations Guide for help getting started with Astro Integrations.


import react from '@astrojs/react';
import mdx from '@astrojs/mdx';
{
  // Example: Add React + MDX support to Astro
  integrations: [react(), mdx()]
}
integrations: [
        
function db(): AstroIntegration[]
db(),
        
function studioCMS(options?: {
    sdk?: boolean | {
        cacheConfig?: boolean | {
            lifetime?: string | undefined;
        } | undefined;
    } | undefined;
    dbStartPage?: boolean | undefined;
    imageService?: {
        cdnPlugin?: "cloudinary-js" | undefined;
    } | undefined;
    defaultFrontEndConfig?: boolean | {
        htmlDefaultLanguage?: string | undefined;
        htmlDefaultHead?: {
            tag: "link" | "title" | "base" | "style" | "meta" | "script" | "noscript" | "template";
            attrs?: Record<string, string | boolean | undefined> | undefined;
            content?: string | undefined;
        }[] | undefined;
        favicon?: string | undefined;
        injectQuickActionsMenu?: boolean | undefined;
    } | undefined;
    dashboardConfig?: {
        dashboardEnabled?: boolean | undefined;
        inject404Route?: boolean | undefined;
        faviconURL?: string | undefined;
        dashboardRouteOverride?: string | undefined;
        AuthConfig?: {
            providers?: {
                github?: boolean | undefined;
                discord?: boolean | undefined;
                google?: boolean | undefined;
                auth0?: boolean | undefined;
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string;
                username ...
StudioCMS Integration


A CMS built for Astro by the Astro Community for the Astro Community.
@see ― The GitHub Repo: withstudiocms/studiocms for more information on how to contribute to StudioCMS.
@see ― The StudioCMS Docs for more information on how to use StudioCMS.
studioCMS({
            
dbStartPage?: boolean | undefined
dbStartPage: false,
            // 其他配置选项
        }),
    ],
});

使用 studiocms.config.mjs 文件（推荐）

Section titled “使用 studiocms.config.mjs 文件（推荐）”

此文件将被自动识别，并覆盖 astro.config.mjs 中的任何配置选项。请将所有 StudioCMS 配置选项移至此文件，如下所示：

文件结构示例

Section titled “文件结构示例”
  • .env
  • astro.config.mjs
  • studiocms.config.mjs
  • studiocms-auth.config.json 自动生成
  • package.json
  • 文件夹src
    • env.d.ts
    • …

配置文件示例

Section titled “配置文件示例”
astro.config.mjs
import 
function db(): AstroIntegration[]
db from '@astrojs/db';
import 
function node(userOptions: UserOptions): AstroIntegration
node from '@astrojs/node';
import 
const studioCMS: (options?: {
    sdk?: boolean | {
        cacheConfig?: boolean | {
            lifetime?: string | undefined;
        } | undefined;
    } | undefined;
    dbStartPage?: boolean | undefined;
    imageService?: {
        cdnPlugin?: "cloudinary-js" | undefined;
    } | undefined;
    defaultFrontEndConfig?: boolean | {
        htmlDefaultLanguage?: string | undefined;
        htmlDefaultHead?: {
            tag: "link" | "title" | "base" | "style" | "meta" | "script" | "noscript" | "template";
            attrs?: Record<string, string | boolean | undefined> | undefined;
            content?: string | undefined;
        }[] | undefined;
        favicon?: string | undefined;
        injectQuickActionsMenu?: boolean | undefined;
    } | undefined;
    dashboardConfig?: {
        dashboardEnabled?: boolean | undefined;
        inject404Route?: boolean | undefined;
        faviconURL?: string | undefined;
        dashboardRouteOverride?: string | undefined;
        AuthConfig?: {
            providers?: {
                github?: boolean | undefined;
                discord?: boolean | undefined;
                google?: boolean | undefined;
                auth0?: boolean | undefined;
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string;
                username ...
StudioCMS Integration


A CMS built for Astro by the Astro Community for the Astro Community.
@see ― The GitHub Repo: withstudiocms/studiocms for more information on how to contribute to StudioCMS.
@see ― The StudioCMS Docs for more information on how to use StudioCMS.
studioCMS from 'studiocms';
import { 
function defineConfig<const TLocales extends Locales = never, const TDriver extends SessionDriverName = never, const TFontFamilies extends FontFamily[] = never>(config: AstroUserConfig<TLocales, TDriver, TFontFamilies>): AstroUserConfig<TLocales, TDriver, TFontFamilies>
See the full Astro Configuration API Documentation
https://astro.build/config
defineConfig } from 'astro/config';


export default 
defineConfig<never, never, never>(config: AstroUserConfig<never, never, never>): AstroUserConfig<never, never, never>
See the full Astro Configuration API Documentation
https://astro.build/config
defineConfig({
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.site?: string
@name ― site
@type ― {string}
@description 
Your final, deployed URL. Astro uses this full URL to generate your sitemap and canonical URLs in your final build. It is strongly recommended that you set this configuration to get the most out of Astro.


{
  site: 'https://www.my-site.dev'
}
site: 'https://demo.studiocms.dev/',
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.output?: "server" | "static"
@name ― output
@type ― {('static' | 'server')}
@default ― 'static'
@see ― adapter *
@description 
Specifies the output target for builds.


    

  • 'static' - Prerender all your pages by default, outputting a completely static site if none of your pages opt out of prerendering.
    • 

  • 'server' - Use server-side rendering (SSR) for all pages by default, always outputting a server-rendered site.
    • 



import { defineConfig } from 'astro/config';


export default defineConfig({
  output: 'static'
})
output: 'server',
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.adapter?: AstroIntegration
@name ― adapter
@see ― output *
@description 
Deploy to your favorite server, serverless, or edge host with build adapters. Import one of our first-party adapters for Netlify, Vercel, and more to engage Astro SSR.


See our On-demand Rendering guide for more on SSR, and our deployment guides for a complete list of hosts.


import netlify from '@astrojs/netlify';
{
  // Example: Build for Netlify serverless deployment
  adapter: netlify(),
}
adapter: 
function node(userOptions: UserOptions): AstroIntegration
node({ 
UserOptions.mode: "standalone" | "middleware"
Specifies the mode that the adapter builds to.


    

  • 'middleware' - Build to middleware, to be used within another Node.js server, such as Express.
    • 

  • 'standalone' - Build to a standalone server. The server starts up just by running the built script.
    • 

mode: "standalone" }),
    
AstroUserConfig<TLocales extends Locales = never, TSession extends SessionDriverName = never, TFontFamilies extends FontFamily[] = never>.integrations?: (false | AstroIntegration | (false | AstroIntegration | null | undefined)[] | null | undefined)[]
@name ― integrations
@description 
Extend Astro with custom integrations. Integrations are your one-stop-shop for adding framework support (like Solid.js), new features (like sitemaps), and new libraries (like Partytown).


Read our Integrations Guide for help getting started with Astro Integrations.


import react from '@astrojs/react';
import mdx from '@astrojs/mdx';
{
  // Example: Add React + MDX support to Astro
  integrations: [react(), mdx()]
}
integrations: [ 
function db(): AstroIntegration[]
db(), 
function studioCMS(options?: {
    sdk?: boolean | {
        cacheConfig?: boolean | {
            lifetime?: string | undefined;
        } | undefined;
    } | undefined;
    dbStartPage?: boolean | undefined;
    imageService?: {
        cdnPlugin?: "cloudinary-js" | undefined;
    } | undefined;
    defaultFrontEndConfig?: boolean | {
        htmlDefaultLanguage?: string | undefined;
        htmlDefaultHead?: {
            tag: "link" | "title" | "base" | "style" | "meta" | "script" | "noscript" | "template";
            attrs?: Record<string, string | boolean | undefined> | undefined;
            content?: string | undefined;
        }[] | undefined;
        favicon?: string | undefined;
        injectQuickActionsMenu?: boolean | undefined;
    } | undefined;
    dashboardConfig?: {
        dashboardEnabled?: boolean | undefined;
        inject404Route?: boolean | undefined;
        faviconURL?: string | undefined;
        dashboardRouteOverride?: string | undefined;
        AuthConfig?: {
            providers?: {
                github?: boolean | undefined;
                discord?: boolean | undefined;
                google?: boolean | undefined;
                auth0?: boolean | undefined;
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string;
                username ...
StudioCMS Integration


A CMS built for Astro by the Astro Community for the Astro Community.
@see ― The GitHub Repo: withstudiocms/studiocms for more information on how to contribute to StudioCMS.
@see ― The StudioCMS Docs for more information on how to use StudioCMS.
studioCMS() ],
});
studiocms.config.mjs
import { 
function defineStudioCMSConfig(config: StudioCMSOptions): {
    sdk?: boolean | {
        cacheConfig?: boolean | {
            lifetime?: string | undefined;
        } | undefined;
    } | undefined;
    dbStartPage?: boolean | undefined;
    imageService?: {
        cdnPlugin?: "cloudinary-js" | undefined;
    } | undefined;
    defaultFrontEndConfig?: boolean | {
        htmlDefaultLanguage?: string | undefined;
        htmlDefaultHead?: {
            tag: "link" | "title" | "base" | "style" | "meta" | "script" | "noscript" | "template";
            attrs?: Record<string, string | boolean | undefined> | undefined;
            content?: string | undefined;
        }[] | undefined;
        favicon?: string | undefined;
        injectQuickActionsMenu?: boolean | undefined;
    } | undefined;
    dashboardConfig?: {
        dashboardEnabled?: boolean | undefined;
        inject404Route?: boolean | undefined;
        faviconURL?: string | undefined;
        dashboardRouteOverride?: string | undefined;
        AuthConfig?: {
            providers?: {
                github?: boolean | undefined;
                discord?: boolean | undefined;
                google?: boolean | undefined;
                auth0?: boolean | undefined;
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string ...
A utility function to define the StudioCMS config object.
This function is used to define the optional StudioCMS
config object in the Astro project root. The expected file
name is studiocms.config.mjs. And it should be adjacent
to the Astro project's astro.config.mjs file.


StudioCMS will attempt to import this file and use the default
export as the StudioCMS config object automatically if it exists.


Using this function is optional, but it can be useful for IDEs
to provide better intellisense and type checking.
@example 
// studiocms.config.mjs
import { defineStudioCMSConfig } from 'studiocms';


export default defineStudioCMSConfig({
 dbStartPage: true,
 contentRenderer: 'marked',
 verbose: true,
 dateLocale: 'en-us',
 // ...Other Options
})
defineStudioCMSConfig } from "studiocms/config";


export default 
function defineStudioCMSConfig(config: StudioCMSOptions): {
    sdk?: boolean | {
        cacheConfig?: boolean | {
            lifetime?: string | undefined;
        } | undefined;
    } | undefined;
    dbStartPage?: boolean | undefined;
    imageService?: {
        cdnPlugin?: "cloudinary-js" | undefined;
    } | undefined;
    defaultFrontEndConfig?: boolean | {
        htmlDefaultLanguage?: string | undefined;
        htmlDefaultHead?: {
            tag: "link" | "title" | "base" | "style" | "meta" | "script" | "noscript" | "template";
            attrs?: Record<string, string | boolean | undefined> | undefined;
            content?: string | undefined;
        }[] | undefined;
        favicon?: string | undefined;
        injectQuickActionsMenu?: boolean | undefined;
    } | undefined;
    dashboardConfig?: {
        dashboardEnabled?: boolean | undefined;
        inject404Route?: boolean | undefined;
        faviconURL?: string | undefined;
        dashboardRouteOverride?: string | undefined;
        AuthConfig?: {
            providers?: {
                github?: boolean | undefined;
                discord?: boolean | undefined;
                google?: boolean | undefined;
                auth0?: boolean | undefined;
                usernameAndPassword?: boolean | undefined;
                usernameAndPasswordConfig?: {
                    allowUserRegistration?: boolean | undefined;
                } | undefined;
            } | undefined;
            enabled?: boolean | undefined;
        } | undefined;
        developerConfig?: {
            demoMode?: false | {
                password: string ...
A utility function to define the StudioCMS config object.
This function is used to define the optional StudioCMS
config object in the Astro project root. The expected file
name is studiocms.config.mjs. And it should be adjacent
to the Astro project's astro.config.mjs file.


StudioCMS will attempt to import this file and use the default
export as the StudioCMS config object automatically if it exists.


Using this function is optional, but it can be useful for IDEs
to provide better intellisense and type checking.
@example 
// studiocms.config.mjs
import { defineStudioCMSConfig } from 'studiocms';


export default defineStudioCMSConfig({
 dbStartPage: true,
 contentRenderer: 'marked',
 verbose: true,
 dateLocale: 'en-us',
 // ...Other Options
})
defineStudioCMSConfig({
    
dbStartPage?: boolean | undefined
dbStartPage: false,
    // 其他配置选项
})