Stylelint runner for Jest
npm install jest-runner-stylelint



Install jest, jest-runner-stylelint, and stylelint
``bash
npm install --save-dev jest jest-runner-stylelint stylelint
yarn add --dev jest jest-runner-stylelint stylelint
`
You must have stylelint configured before it'll lint any of your files. Please follow the stylelint documentation on configuration to create your config.
#### Using Built-in Preset
This package includes a Jest preset which configures Jest to run stylelint on all files supported by styleint. To use it set the following in your package.json:
`json`
{
"jest": {
"preset": "jest-runner-stylelint"
}
}
or jest.config.js:
`js`
module.exports = {
preset: "jest-runner-stylelint",
};
#### Manually
In your package.json
`json`
{
"jest": {
"runner": "stylelint",
"moduleFileExtensions": [
"css",
"sass",
"scss",
"less",
"sss",
"htm",
"html",
"md",
"markdown",
"mdx",
"js",
"jsx",
"ts",
"tsx",
"vue"
],
"testMatch": [
"*/.css",
"*/.sass",
"*/.scss",
"*/.less",
"*/.sss",
"*/.htm",
"*/.html",
"*/.md",
"*/.markdown",
"*/.mdx",
"*/.js",
"*/.jsx",
"*/.ts",
"*/.tsx",
"*/.vue"
]
}
}
Or in jest.config.js
`js`
module.exports = {
runner: "stylelint",
moduleFileExtensions: [
"css",
"sass",
"scss",
"less",
"sss",
"htm",
"html",
"md",
"markdown",
"mdx",
"js",
"jsx",
"ts",
"tsx",
"vue",
],
testMatch: [
"*/.css",
"*/.sass",
"*/.scss",
"*/.less",
"*/.sss",
"*/.htm",
"*/.html",
"*/.md",
"*/.markdown",
"*/.mdx",
"*/.js",
"*/.jsx",
"*/.ts",
"*/.tsx",
"*/.vue",
],
};
`bash
npx jest
yarn jest
`
in watch modejest-stylelint-runner comes with a watch plugin that allows you to toggle the --fix value while in watch mode without having to update your configuration.
To use this watch plugin simply add this to your Jest configuration.
`js`
{
watchPlugins: ['jest-runner-stylelint/watch-fix'],
}
After this run Jest in watch mode and you will see the following line in your watch usage menu.
``
› Press F to override Stylelint --fix.
This project uses cosmiconfig, so you can provide config via:
- a jest-runner-stylelint property in your package.jsonjest-runner-stylelint.config.js
- a JS file.jest-runner-stylelintrc
- a JSON file
In package.json
`json`
{
"jest-runner-stylelint": {
"cliOptions": {
// Options here
}
}
}
or in jest-runner-stylelint.config.js
`js``
module.exports = {
cliOptions: {
// Options here
},
};
Follow the stylelint documentation on configuration to create your cli options.