New Powerful Machines

    eslint-plugin-storybook

    0.5.13 • Public • Published

    Storybook

    Build bulletproof UI components faster


    Storybook Community Backers on Open Collective Sponsors on Open Collective Official Twitter Handle

    eslint-plugin-storybook

    Best practice rules for Storybook

    Installation

    You'll first need to install ESLint:

    npm install eslint --save-dev
    # or
    yarn add eslint --dev

    Next, install eslint-plugin-storybook:

    npm install eslint-plugin-storybook --save-dev
    # or
    yarn add eslint-plugin-storybook --dev

    Usage

    Use .eslintrc.* file to configure rules. See also: https://eslint.org/docs/user-guide/configuring

    Add plugin:storybook/recommended to the extends section of your .eslintrc configuration file. Note that we can omit the eslint-plugin- prefix:

    {
      // extend plugin:storybook/<configuration>, such as:
      "extends": ["plugin:storybook/recommended"]
    }

    This plugin will only be applied to files following the *.stories.* (we recommend this) or *.story.* pattern. This is an automatic configuration, so you don't have to do anything.

    Overriding/disabling rules

    Optionally, you can override, add or disable rules settings. You likely don't want these settings to be applied in every file, so make sure that you add a overrides section in your .eslintrc.* file that applies the overrides only to your stories files.

    {
      "overrides": [
        {
          // or whatever matches stories specified in .storybook/main.js
          "files": ['*.stories.@(ts|tsx|js|jsx|mjs|cjs)'],
          "rules": {
            // example of overriding a rule
            'storybook/hierarchy-separator': 'error',
            // example of disabling a rule
            'storybook/default-exports': 'off',
          }
        }
      ]
    }

    MDX Support

    This plugin does not support MDX files.

    Supported Rules and configurations

    Key: 🔧 = fixable

    Configurations: csf, csf-strict, addon-interactions, recommended

    Name Description 🔧 Included in configurations
    storybook/await-interactions Interactions should be awaited 🔧
    • addon-interactions
    • recommended
    storybook/context-in-play-function Pass a context when invoking play function of another story
    • recommended
    • addon-interactions
    storybook/csf-component The component property should be set
    • csf
    storybook/default-exports Story files should have a default export 🔧
    • csf
    • recommended
    storybook/hierarchy-separator Deprecated hierarchy separator in title property 🔧
    • csf
    • recommended
    storybook/no-redundant-story-name A story should not have a redundant name property 🔧
    • csf
    • recommended
    storybook/no-stories-of storiesOf is deprecated and should not be used
    • csf-strict
    storybook/no-title-property-in-meta Do not define a title in meta 🔧
    • csf-strict
    storybook/prefer-pascal-case Stories should use PascalCase 🔧
    • recommended
    storybook/story-exports A story file must contain at least one story export
    • recommended
    • csf
    storybook/use-storybook-expect Use expect from @storybook/jest 🔧
    • addon-interactions
    • recommended
    storybook/use-storybook-testing-library Do not use testing-library directly on stories 🔧
    • addon-interactions
    • recommended

    Contributors

    Looking into improving this plugin? That would be awesome! Please refer to the contributing guidelines for steps to contributing.

    License

    MIT

    Install

    npm i eslint-plugin-storybook

    DownloadsWeekly Downloads

    593,960

    Version

    0.5.13

    License

    MIT

    Unpacked Size

    84.9 kB

    Total Files

    27

    Last publish

    Collaborators

    • rafaelrozon
    • yannbf