Issue
This Content is from Stack Overflow. Question asked by cp20
I want to set up a repository that uses storybook and stylelint, but got the error below.
TypeError: Cannot read properties of undefined (reading 'stringify')
at Function.stringify (#####/node_modules/postcss-syntax/stringify.js:8:38)
at MapGenerator.generate (#####/node_modules/stylelint/node_modules/postcss/lib/map-generator.js:323:12)
at LazyResult.stringify (#####/node_modules/stylelint/node_modules/postcss/lib/lazy-result.js:277:20)
at LazyResult.runAsync (#####/node_modules/stylelint/node_modules/postcss/lib/lazy-result.js:443:17)
at LazyResult.async (#####/node_modules/stylelint/node_modules/postcss/lib/lazy-result.js:221:30)
at LazyResult.then (#####/node_modules/stylelint/node_modules/postcss/lib/lazy-result.js:206:17)
How to reproduce the bug
- set up Next.js app
npx create-next-app@latest storybook-with-stylelint-test --ts
- install stylelint and plugins
yarn add -D stylelint @stylelint/postcss-css-in-js postcss-syntax
- set up stylelint
.stylelintrc.js
module.exports = {
overrides: [
{
files: ['**/*.{js,jsx,ts,tsx}'],
customSyntax: '@stylelint/postcss-css-in-js',
},
rules: {
'string-quotes': ['single'],
},
],
};
package.json
{
...
"scripts": {
...
"stylelint": "stylelint --ignore-path .gitignore './**/*.{css,scss,ts,tsx}'",
},
...
}
- set up storybook
npx sb init --builder webpack5
- run stylelint
yarn stylelint
- the error occured
Here is the repository that reproduces the bug: https://github.com/cp-20/storybook-with-stylelint-test
How can I fix this?
Solution
This question is not yet answered, be the first one who answer using the comment. Later the confirmed answer will be published as the solution.
This Question and Answer are collected from stackoverflow and tested by JTuto community, is licensed under the terms of CC BY-SA 2.5. - CC BY-SA 3.0. - CC BY-SA 4.0.