Socket
Socket
Sign inDemoInstall

eslint-plugin-storybook

Package Overview
Dependencies
1
Maintainers
1
Versions
91
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    eslint-plugin-storybook

ESlint rules for Storybook Best Practices


Version published
Weekly downloads
1.9M
decreased by-21.46%
Maintainers
1
Created
Weekly downloads
 

Package description

What is eslint-plugin-storybook?

The eslint-plugin-storybook npm package is designed to help enforce best practices and conventions for writing stories in Storybook, which is a tool for developing UI components in isolation. It provides a set of ESLint rules specifically tailored for Storybook files.

What are eslint-plugin-storybook's main functionalities?

Enforce consistent naming for story files

This rule ensures that the names of the stories are consistent with the file name.

"storybook/consistent-story-name": "error"

Require or disallow a specific structure in story files

This rule can enforce a specific structure for story exports, such as allowing only default or named exports in story files.

"storybook/story-exports": ["error", { "allow": ["default", "named"] }]

Enforce the use of Storybook's controls

This rule ensures that stories use Storybook's controls feature to allow for live customization of component props.

"storybook/use-storybook-controls": "error"

Other packages similar to eslint-plugin-storybook

Readme

Source

eslint-plugin-storybook

Eslint rules for Storybook Best Practices

Installation

You'll first need to install ESLint:

$ npm i eslint --save-dev

Next, install eslint-plugin-storybook:

$ npm install eslint-plugin-storybook --save-dev

Usage

Add storybook to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:

{
    "plugins": [
        "storybook"
    ]
}

Then configure the rules you want to use under the rules section.

{
    "rules": {
        "storybook/prefer-csf": "error"
    }
}

Supported Rules

  • prefer-csf: Display lint message when storiesOf API is used instead of the Component Story Format

Keywords

FAQs

Last updated on 15 Mar 2021

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc