build
Parent: main.js|ts configuration
Type: TestBuildConfig
Provides configuration options to optimize Storybook's production build output.
test
Type: TestBuildFlags
{
disableBlocks?: boolean;
disabledAddons?: string[];
disableMDXEntries?: boolean;
disableAutoDocs?: boolean;
disableDocgen?: boolean;
disableSourcemaps?: boolean;
disableTreeShaking?: boolean;
}
Configures Storybook's production builds for performance testing purposes by disabling certain features from the build. When running build-storybook
, this feature is enabled by setting the --test
flag.
The options documented on this page are automatically enabled when the --test
flag is provided to the build-storybook
command. We encourage you to override these options only if you need to disable a specific feature for your project or if you are debugging a build issue.
test.disableBlocks
Type: boolean
Excludes the @storybook/blocks
package from the build, which generates automatic documentation with Docs Blocks.
export default {
// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
build: {
test: {
disableBlocks: false,
},
},
};
test.disabledAddons
Type: string[]
Sets the list of addons that will disabled in the build output.
export default {
// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
addons: [
'@storybook/addon-links',
'@storybook/addon-essentials',
'@storybook/addon-interactions',
'@storybook/addon-a11y',
],
build: {
test: {
disabledAddons: ['@storybook/addon-a11y'],
},
},
};
test.disableMDXEntries
Type: boolean
Enabling this option removes user-written documentation entries in MDX format from the build.
export default {
// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
build: {
test: {
disableMDXEntries: false,
},
},
};
test.disableAutoDocs
Type: boolean
Prevents automatic documentation generated with the autodocs feature from being included in the build.
export default {
// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
build: {
test: {
disableAutoDocs: false,
},
},
};
test.disableDocgen
Type: boolean
Disables automatic argType and component property inference with any of the supported static analysis tools based on the framework you are using.
export default {
// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
build: {
test: {
disableDocgen: false,
},
},
};
test.disableSourcemaps
Type: boolean
Overrides the default behavior of generating source maps for the build.
export default {
// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
build: {
test: {
disableSourcemaps: false,
},
},
};
test.disableTreeShaking
Type: boolean
Disables tree shaking in the build.
export default {
// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
build: {
test: {
disableTreeShaking: false,
},
},
};