Skip to content

Commit a32dbd3

Browse files
kasperpeulenkasperpeulen
authored
Merge pull request #156 from storybookjs/feat/add-flat-config-format
feat: support flat config
2 parents d5a9ce1 + ce8985b commit a32dbd3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

74 files changed

+1635
-619
lines changed

‎.eslintignore

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
# don't ever lint node_modules
22
node_modules
33
# don't lint build output
4-
build
4+
dist
55
# don't lint nyc coverage output
66
coverage
77

88
tools
9+
tests/integrations/**/*.stories.tsx

‎.github/workflows/release.yml

+12-4
Original file line numberDiff line numberDiff line change
@@ -7,19 +7,27 @@ jobs:
77
runs-on: ubuntu-latest
88
if: "!contains(github.event.head_commit.message, 'ci skip') && !contains(github.event.head_commit.message, 'skip ci')"
99
steps:
10-
- uses: actions/checkout@v2
10+
- name: Checkout codes
11+
uses: actions/checkout@v4
1112

1213
- name: Prepare repository
1314
run: git fetch --unshallow --tags
1415

16+
- name: Enable corepack
17+
run: corepack enable
18+
19+
- name: Setup node
20+
uses: actions/setup-node@v4
21+
with:
22+
node-version: 18
23+
cache: 'pnpm'
24+
1525
- uses: pnpm/action-setup@v4
1626
with:
17-
version: 9
1827
run_install: true
1928

2029
- name: Create Release
2130
env:
2231
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
2332
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
24-
run: |
25-
pnpm run release
33+
run: pnpm run release

‎.github/workflows/test.yml

+14-4
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,24 @@ jobs:
66
test:
77
runs-on: ubuntu-latest
88
steps:
9-
- uses: actions/checkout@v2
9+
- name: Checkout codes
10+
uses: actions/checkout@v4
1011

12+
- name: Enable corepack
13+
run: corepack enable
14+
15+
- name: Setup node
16+
uses: actions/setup-node@v4
17+
with:
18+
node-version: 18
19+
cache: 'pnpm'
1120

1221
- uses: pnpm/action-setup@v4
1322
with:
14-
version: 9
1523
run_install: true
1624

25+
- name: Build
26+
run: pnpm run build
27+
1728
- name: Run tests
18-
run: |
19-
pnpm run test:ci
29+
run: pnpm run test:ci

‎.gitignore

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
22

33
# dependencies
4-
/node_modules
4+
node_modules
55
/.pnp
66
.pnp.js
77

8+
tests/integrations/**/pnpm-lock.yaml
9+
810
# testing
911
/coverage
1012

‎CHANGELOG.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -190,9 +190,9 @@ The `story-exports` rule now detects whether you are using `includeStories/exclu
190190
export default {
191191
title: 'Button',
192192
includeStories: ['myStory'], // <-- notice the lowercase m, which won't match with the story name
193-
};
193+
}
194194

195-
export const MyStory = {};
195+
export const MyStory = {}
196196
```
197197

198198
---
@@ -569,7 +569,7 @@ export const MyStory = {};
569569

570570
- no-title-property-in-meta: fix dangling comma and highlighting [#32](https://github.com/storybookjs/eslint-plugin-storybook/pull/32) ([@yannbf](https://github.com/yannbf))
571571
- Update docs [#35](https://github.com/storybookjs/eslint-plugin-storybook/pull/35) ([@kylegach](https://github.com/kylegach) [@yannbf](https://github.com/yannbf))
572-
- prefer-pascal-case: ignore __namedExportsOrder [#34](https://github.com/storybookjs/eslint-plugin-storybook/pull/34) ([@yannbf](https://github.com/yannbf))
572+
- prefer-pascal-case: ignore \_\_namedExportsOrder [#34](https://github.com/storybookjs/eslint-plugin-storybook/pull/34) ([@yannbf](https://github.com/yannbf))
573573
- hierarchy-separator: fix node highlight [#33](https://github.com/storybookjs/eslint-plugin-storybook/pull/33) ([@yannbf](https://github.com/yannbf))
574574
- no-redundant-story-name: add CSF2 support [#31](https://github.com/storybookjs/eslint-plugin-storybook/pull/31) ([@yannbf](https://github.com/yannbf))
575575
- prefer-pascal-case: add non-story exports check [#30](https://github.com/storybookjs/eslint-plugin-storybook/pull/30) ([@yannbf](https://github.com/yannbf))

‎README.md

+73-18
Original file line numberDiff line numberDiff line change
@@ -59,9 +59,23 @@ This allows for this plugin to also lint your configuration files inside the .st
5959

6060
> For more info on why this line is required in the .eslintignore file, check this [ESLint documentation](https://eslint.org/docs/latest/user-guide/configuring/ignoring-code#:~:text=In%20addition%20to,contents%2C%20are%20ignored).
6161
62+
If you are using [flat config style](https://eslint.org/docs/latest/use/configure/configuration-files-new), add this to your configuration file:
63+
64+
```js
65+
export default [
66+
// ...
67+
{
68+
// Inside your .eslintignore file
69+
ignores: ['!.storybook'],
70+
},
71+
]
72+
```
73+
6274
## Usage
6375

64-
Use `.eslintrc.*` file to configure rules. See also: https://eslint.org/docs/user-guide/configuring
76+
### Configuration (`.eslintrc`)
77+
78+
Use `.eslintrc.*` file to configure rules in ESLint < v9. See also: https://eslint.org/docs/latest/use/configure/.
6579

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

@@ -74,7 +88,7 @@ Add `plugin:storybook/recommended` to the extends section of your `.eslintrc` co
7488

7589
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.
7690

77-
### Overriding/disabling rules
91+
#### Overriding/disabling rules
7892

7993
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.
8094

@@ -83,7 +97,7 @@ Optionally, you can override, add or disable rules settings. You likely don't wa
8397
"overrides": [
8498
{
8599
// or whatever matches stories specified in .storybook/main.js
86-
"files": ['*.stories.@(ts|tsx|js|jsx|mjs|cjs)'],
100+
"files": ['**/*.stories.@(ts|tsx|js|jsx|mjs|cjs)'],
87101
"rules": {
88102
// example of overriding a rule
89103
'storybook/hierarchy-separator': 'error',
@@ -95,6 +109,47 @@ Optionally, you can override, add or disable rules settings. You likely don't wa
95109
}
96110
```
97111

112+
### Configuration (`eslint.config.[c|m]?js`)
113+
114+
Use `eslint.config.[c|m]?js` file to configure rules. This is the default in ESLint v9, but can be used starting from ESLint v8.57.0. See also: https://eslint.org/docs/latest/use/configure/configuration-files-new.
115+
116+
```js
117+
import storybook from 'eslint-plugin-storybook'
118+
119+
export default [
120+
// add more generic rulesets here, such as:
121+
// js.configs.recommended,
122+
...storybook.configs['flat/recommended'],
123+
124+
// something ...
125+
]
126+
```
127+
128+
#### Overriding/disabling rules
129+
130+
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 flat config section in your `eslint.config.[m|c]?js` file that applies the overrides only to your stories files.
131+
132+
```js
133+
import storybook from 'eslint-plugin-storybook'
134+
135+
export default [
136+
// ...
137+
138+
...storybook.configs['flat/recommended'],
139+
{
140+
files: ['**/*.stories.@(ts|tsx|js|jsx|mjs|cjs)'],
141+
rules: {
142+
// example of overriding a rule
143+
'storybook/hierarchy-separator': 'error',
144+
// example of disabling a rule
145+
'storybook/default-exports': 'off',
146+
},
147+
},
148+
149+
// something ...
150+
]
151+
```
152+
98153
### MDX Support
99154

100155
This plugin does not support MDX files.
@@ -107,21 +162,21 @@ This plugin does not support MDX files.
107162

108163
**Configurations**: csf, csf-strict, addon-interactions, recommended
109164

110-
| Name | Description | 🔧 | Included in configurations |
111-
| ------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------- | --- | -------------------------------------------------------- |
112-
| [`storybook/await-interactions`](./docs/rules/await-interactions.md) | Interactions should be awaited | 🔧 | <ul><li>addon-interactions</li><li>recommended</li></ul> |
113-
| [`storybook/context-in-play-function`](./docs/rules/context-in-play-function.md) | Pass a context when invoking play function of another story | | <ul><li>recommended</li><li>addon-interactions</li></ul> |
114-
| [`storybook/csf-component`](./docs/rules/csf-component.md) | The component property should be set | | <ul><li>csf</li></ul> |
115-
| [`storybook/default-exports`](./docs/rules/default-exports.md) | Story files should have a default export | 🔧 | <ul><li>csf</li><li>recommended</li></ul> |
116-
| [`storybook/hierarchy-separator`](./docs/rules/hierarchy-separator.md) | Deprecated hierarchy separator in title property | 🔧 | <ul><li>csf</li><li>recommended</li></ul> |
117-
| [`storybook/no-redundant-story-name`](./docs/rules/no-redundant-story-name.md) | A story should not have a redundant name property | 🔧 | <ul><li>csf</li><li>recommended</li></ul> |
118-
| [`storybook/no-stories-of`](./docs/rules/no-stories-of.md) | storiesOf is deprecated and should not be used | | <ul><li>csf-strict</li></ul> |
119-
| [`storybook/no-title-property-in-meta`](./docs/rules/no-title-property-in-meta.md) | Do not define a title in meta | 🔧 | <ul><li>csf-strict</li></ul> |
120-
| [`storybook/no-uninstalled-addons`](./docs/rules/no-uninstalled-addons.md) | This rule identifies storybook addons that are invalid because they are either not installed or contain a typo in their name. | | <ul><li>recommended</li></ul> |
121-
| [`storybook/prefer-pascal-case`](./docs/rules/prefer-pascal-case.md) | Stories should use PascalCase | 🔧 | <ul><li>recommended</li></ul> |
122-
| [`storybook/story-exports`](./docs/rules/story-exports.md) | A story file must contain at least one story export | | <ul><li>recommended</li><li>csf</li></ul> |
123-
| [`storybook/use-storybook-expect`](./docs/rules/use-storybook-expect.md) | Use expect from `@storybook/jest` | 🔧 | <ul><li>addon-interactions</li><li>recommended</li></ul> |
124-
| [`storybook/use-storybook-testing-library`](./docs/rules/use-storybook-testing-library.md) | Do not use testing-library directly on stories | 🔧 | <ul><li>addon-interactions</li><li>recommended</li></ul> |
165+
| Name | Description | 🔧 | Included in configurations |
166+
| ------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------- | --- | ----------------------------------------------------------------------------------------------------------------- |
167+
| [`storybook/await-interactions`](./docs/rules/await-interactions.md) | Interactions should be awaited | 🔧 | <ul><li>addon-interactions</li><li>flat/addon-interactions</li><li>recommended</li><li>flat/recommended</li></ul> |
168+
| [`storybook/context-in-play-function`](./docs/rules/context-in-play-function.md) | Pass a context when invoking play function of another story | | <ul><li>recommended</li><li>flat/recommended</li><li>addon-interactions</li><li>flat/addon-interactions</li></ul> |
169+
| [`storybook/csf-component`](./docs/rules/csf-component.md) | The component property should be set | | <ul><li>csf</li><li>flat/csf</li></ul> |
170+
| [`storybook/default-exports`](./docs/rules/default-exports.md) | Story files should have a default export | 🔧 | <ul><li>csf</li><li>flat/csf</li><li>recommended</li><li>flat/recommended</li></ul> |
171+
| [`storybook/hierarchy-separator`](./docs/rules/hierarchy-separator.md) | Deprecated hierarchy separator in title property | 🔧 | <ul><li>csf</li><li>flat/csf</li><li>recommended</li><li>flat/recommended</li></ul> |
172+
| [`storybook/no-redundant-story-name`](./docs/rules/no-redundant-story-name.md) | A story should not have a redundant name property | 🔧 | <ul><li>csf</li><li>flat/csf</li><li>recommended</li><li>flat/recommended</li></ul> |
173+
| [`storybook/no-stories-of`](./docs/rules/no-stories-of.md) | storiesOf is deprecated and should not be used | | <ul><li>csf-strict</li><li>flat/csf-strict</li></ul> |
174+
| [`storybook/no-title-property-in-meta`](./docs/rules/no-title-property-in-meta.md) | Do not define a title in meta | 🔧 | <ul><li>csf-strict</li><li>flat/csf-strict</li></ul> |
175+
| [`storybook/no-uninstalled-addons`](./docs/rules/no-uninstalled-addons.md) | This rule identifies storybook addons that are invalid because they are either not installed or contain a typo in their name. | | <ul><li>recommended</li><li>flat/recommended</li></ul> |
176+
| [`storybook/prefer-pascal-case`](./docs/rules/prefer-pascal-case.md) | Stories should use PascalCase | 🔧 | <ul><li>recommended</li><li>flat/recommended</li></ul> |
177+
| [`storybook/story-exports`](./docs/rules/story-exports.md) | A story file must contain at least one story export | | <ul><li>recommended</li><li>flat/recommended</li><li>csf</li><li>flat/csf</li></ul> |
178+
| [`storybook/use-storybook-expect`](./docs/rules/use-storybook-expect.md) | Use expect from `@storybook/jest` | 🔧 | <ul><li>addon-interactions</li><li>flat/addon-interactions</li><li>recommended</li><li>flat/recommended</li></ul> |
179+
| [`storybook/use-storybook-testing-library`](./docs/rules/use-storybook-testing-library.md) | Do not use testing-library directly on stories | 🔧 | <ul><li>addon-interactions</li><li>flat/addon-interactions</li><li>recommended</li><li>flat/recommended</li></ul> |
125180

126181
<!-- RULES-LIST:END -->
127182

‎docs/rules/await-interactions.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>addon-interactions</li><li>recommended</li></ul>
5+
**Included in these configurations**: <ul><li>addon-interactions</li><li>flat/addon-interactions</li><li>recommended</li><li>flat/recommended</li></ul>
66

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

‎docs/rules/context-in-play-function.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>recommended</li><li>addon-interactions</li></ul>
5+
**Included in these configurations**: <ul><li>recommended</li><li>flat/recommended</li><li>addon-interactions</li><li>flat/addon-interactions</li></ul>
66

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

‎docs/rules/csf-component.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>csf</li></ul>
5+
**Included in these configurations**: <ul><li>csf</li><li>flat/csf</li></ul>
66

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

‎docs/rules/default-exports.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>csf</li><li>recommended</li></ul>
5+
**Included in these configurations**: <ul><li>csf</li><li>flat/csf</li><li>recommended</li><li>flat/recommended</li></ul>
66

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

‎docs/rules/hierarchy-separator.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>csf</li><li>recommended</li></ul>
5+
**Included in these configurations**: <ul><li>csf</li><li>flat/csf</li><li>recommended</li><li>flat/recommended</li></ul>
66

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

@@ -35,5 +35,5 @@ For more details about this change: https://github.com/storybookjs/storybook/blo
3535
To automatically migrate all of your codebase and fix this issue, run this codemod in the root folder of your project:
3636

3737
```sh
38-
npx sb@next migrate upgrade-hierarchy-separators --glob="*/**/*.stories.@(tsx|jsx|ts|js)"
38+
npx storybook@latest migrate upgrade-hierarchy-separators --glob="*/**/*.stories.@(tsx|jsx|ts|js)"
3939
```

‎docs/rules/no-redundant-story-name.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>csf</li><li>recommended</li></ul>
5+
**Included in these configurations**: <ul><li>csf</li><li>flat/csf</li><li>recommended</li><li>flat/recommended</li></ul>
66

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

‎docs/rules/no-stories-of.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>csf-strict</li></ul>
5+
**Included in these configurations**: <ul><li>csf-strict</li><li>flat/csf-strict</li></ul>
66

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

@@ -52,5 +52,5 @@ For more information about the change from `storiesOf` to `CSF`, read here: http
5252
To automatically migrate all of your codebase, run this codemod in the root folder of your project:
5353

5454
```sh
55-
npx sb@next migrate storiesof-to-csf --glob="*/**/*.stories.@(tsx|jsx|ts|js)"
55+
npx storybook@latest migrate storiesof-to-csf --glob="*/**/*.stories.@(tsx|jsx|ts|js)"
5656
```

‎docs/rules/no-title-property-in-meta.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>csf-strict</li></ul>
5+
**Included in these configurations**: <ul><li>csf-strict</li><li>flat/csf-strict</li></ul>
66

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

‎docs/rules/no-uninstalled-addons.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>recommended</li></ul>
5+
**Included in these configurations**: <ul><li>recommended</li><li>flat/recommended</li></ul>
66

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

‎docs/rules/prefer-pascal-case.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>recommended</li></ul>
5+
**Included in these configurations**: <ul><li>recommended</li><li>flat/recommended</li></ul>
66

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

‎docs/rules/story-exports.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

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

5-
**Included in these configurations**: <ul><li>recommended</li><li>csf</li></ul>
5+
**Included in these configurations**: <ul><li>recommended</li><li>flat/recommended</li><li>csf</li><li>flat/csf</li></ul>
66

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

0 commit comments

Comments
 (0)