Created from https://github.com/digiaonline/react-boilerplate
Seems like lint-staged or stylefmt doesn't work correctly if you try to add 2 css files into a commit, and if one of those files has lint errors.
When git pre-commit
hook is run, stylefmt autofixes lint errors. You end up with one file that still has lint errors and one file that has now all of it's original content overwritten by the autofixed contents of the other file.
- Install Yarn globally (if you don't have it yet) https://yarnpkg.com/lang/en/docs/install/
- Clone this repo
- Change contents of
src/hello/components/Hello.css
so that the file has css lint errors (add too much indent for example) - Change contents of
src/root/components/Root.css
so that the file has css lint errors (add too much indent for example) - Type
git add .
- Type
yarn precommit
- Open both css files. One of the files should have been overwritten with the content from the other file.
This issue seems to fix itself if you modify .lintstagedrc
to this
{
"*.js": [
"prettier-eslint --write \"src/**/*.js\"",
"git add"
],
"*.css": [
"stylefmt --recursive",
"git add"
]
}
So if you add --recursive
to this line "stylefmt --recursive",
More discussion on the topic here lint-staged/lint-staged#164