Back to Storybook

Stories file should have a default export (default-exports)

code/lib/eslint-plugin/docs/rules/default-exports.md

10.3.61.6 KB
Original Source

Stories file should have a default export (default-exports)

<!-- RULE-CATEGORIES:START -->

Included in these configurations: <ul><li>csf</li><li>flat/csf</li><li>recommended</li><li>flat/recommended</li><li>csf-strict</li><li>flat/csf-strict</li></ul>

<!-- RULE-CATEGORIES:END -->

Rule Details

In CSF, a story file should contain a default export that describes the component, and named exports that describe the stories. This rule enforces the definition of a default export in story files.

Examples of incorrect code for this rule:

js
// no default export
export const Primary = {};

Examples of correct code for this rule:

js
export default {
  title: "Button",
  args: { primary: true },
  component: Button,
};
export const Primary = {};

When Not To Use It

This rule should only be applied in your .stories.* files. Please ensure that you define the Storybook rules only for story files. You can see more details here.

If you're using Storybook 6.5 and CSF in MDX, you should disable this rule for the stories that use CSF in MDX. You can see how to override the rule here.

Further Reading

More information about defining stories here: https://storybook.js.org/docs/writing-stories#defining-stories