main-config-core.md

title
core

Parent: main.js|ts configuration

Type:

{
  builder?: string | { name: string; options?: BuilderOptions };
  channelOptions?: ChannelOptions;
  crossOriginIsolated?: boolean;
  disableProjectJson?: boolean;
  disableTelemetry?: boolean;
  disableWebpackDefaults?: boolean;
  disableWhatsNewNotifications?: boolean;
  enableCrashReports?: boolean;
  renderer?: RendererName;
}

Configures Storybook's internal features.

builder

Type:

| '@storybook/builder-vite' | '@storybook/builder-webpack5'
| {
    name: '@storybook/builder-vite' | '@storybook/builder-webpack5';
    options?: BuilderOptions;
  }

Configures Storybook's builder, Vite or Webpack.

With the new Framework API, framework.options.builder is now the preferred way to configure the builder.

You should only use core.builder.options if you need to configure a builder that is not part of a framework.

<CodeSnippets paths={[ 'common/main-config-core-builder.js.mdx', 'common/main-config-core-builder.ts.mdx', ]} />

channelOptions

Type: ChannelOptions

{
  allowClass: boolean;
  allowDate: boolean;
  allowFunction: boolean;
  allowRegExp: boolean;
  allowSymbol: boolean;
  allowUndefined: boolean;
  lazyEval: boolean;
  maxDepth: number;
  space: number | undefined;
}

Configures the channel used by Storybook to communicate between the manager and preview.

Only two properties are likely to be used:

channelOptions.allowFunction

Type: boolean

Default: false

Enables serializing functions across the channel, which can be a security risk.

channelOptions.maxDepth

Type: number

Default: 3

The maximum depth of nested objects to serialize across the channel. Larger values will be slower.

crossOriginIsolated

Type: boolean

Enable CORS headings to run document in a "secure context". See SharedArrayBuffer security requirements

This enables these headers in development-mode:

• Cross-Origin-Opener-Policy: same-origin
• Cross-Origin-Embedder-Policy: require-corp

<CodeSnippets paths={[ 'common/main-config-core-cross-origin-isolated.js.mdx', 'common/main-config-core-cross-origin-isolated.ts.mdx', ]} />

disableProjectJson

Type: boolean

Disables the generation of project.json, a file containing Storybook metadata

<CodeSnippets paths={[ 'common/main-config-core-disable-project-json.js.mdx', 'common/main-config-core-disable-project-json.ts.mdx', ]} />

disableTelemetry

Type: boolean

Disables Storybook's telemetry collection.

<CodeSnippets paths={[ 'common/main-config-core-disable-telemetry.js.mdx', 'common/main-config-core-disable-telemetry.ts.mdx', ]} />

disableWebpackDefaults

Type: boolean

Disables Storybook's default Webpack configuration.

<CodeSnippets paths={[ 'common/main-config-core-disable-webpack-defaults.js.mdx', 'common/main-config-core-disable-webpack-defaults.ts.mdx', ]} />

disableWhatsNewNotifications

Type: boolean

Disables the "What's New" notifications in the UI for new Storybook versions and ecosystem updates (e.g., addons, content, etc.).

<CodeSnippets paths={[ 'common/main-config-core-disable-update-notifications.js.mdx', 'common/main-config-core-disable-update-notifications.ts.mdx', ]} />

enableCrashReports

Type: boolean

Enable crash reports to be sent to Storybook telemetry.

<CodeSnippets paths={[ 'common/main-config-core-enable-crash-reports.js.mdx', 'common/main-config-core-enable-crash-reports.ts.mdx', ]} />

renderer

Type: RendererName