features
类型
{
actions?: boolean;
argTypeTargetsV7?: boolean;
backgrounds?: boolean;
controls?: boolean;
developmentModeForBuild?: boolean;
experimentalTestSyntax?: boolean;
highlight?: boolean;
interactions?: boolean;
legacyDecoratorFileOrder?: boolean;
measure?: boolean;
outline?: boolean;
toolbars?: boolean;
viewport?: boolean;
}启用 Storybook 的附加功能。
actions
类型:boolean
启用 Actions 功能。
argTypeTargetsV7
(⚠️ 实验性)
类型:boolean
根据渲染函数的类型“target”过滤参数。
.storybook/main.ts
// Replace your-framework with the framework you are using, e.g. react-vite, nextjs, vue3-vite, etc.
import type { StorybookConfig } from '@storybook/your-framework';
const config: StorybookConfig = {
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
features: {
argTypeTargetsV7: true,
},
};
export default config;backgrounds
类型:boolean
启用 Backgrounds 功能。
controls
类型:boolean
启用 Controls 功能。
developmentModeForBuild
类型:boolean
在构建的 Storybooks 中将 NODE_ENV 设置为 'development',以获得更好的测试和调试功能。
.storybook/main.ts
// Replace your-framework with the framework you are using, e.g. react-vite, nextjs, vue3-vite, etc.
import type { StorybookConfig } from '@storybook/your-framework';
const config: StorybookConfig = {
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
features: {
developmentModeForBuild: true,
},
};
export default config;experimentalTestSyntax
(⚠️ 实验性)
类型:boolean
启用 实验性的 .test 方法(使用 CSF Next 格式)。
.storybook/main.js|ts (CSF Next 🧪)
// Replace your-framework with the framework you are using (e.g., react-vite, nextjs, nextjs-vite)
import { defineMain } from '@storybook/your-framework/node';
export default defineMain({
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
features: {
experimentalTestSyntax: true,
},
});highlight
类型:boolean
启用 Highlight 功能。
interactions
类型:boolean
启用 Interactions 功能。
legacyDecoratorFileOrder
类型:boolean
在插件或框架的装饰器之前应用 preview.js 中的装饰器。 更多信息。
.storybook/main.ts
// Replace your-framework with the framework you are using, e.g. react-vite, nextjs, vue3-vite, etc.
import type { StorybookConfig } from '@storybook/your-framework';
const config: StorybookConfig = {
framework: '@storybook/your-framework',
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
features: {
legacyDecoratorFileOrder: true,
},
};
export default config;measure
类型:boolean
启用 Measure 功能。
outline
类型:boolean
启用 Outline 功能。
toolbars
类型:boolean
启用 Toolbars 功能。
viewport
类型:boolean
启用 Viewport 功能。
