Linting & formatting
This project uses ESLint, Stylelint, Markdownlint, and Prettier to catch errors and avoid bikeshedding by enforcing a common code style.
- HTML (in templates and JSX) is linted by ESLint
- CSS is linted by Stylelint and formatted by Prettier
- GraphQL is linted by ESLint and formatted by Prettier
- Markdown is linted by Markdownlint and formatted by Prettier
- JSON is formatted by Prettier
- Images are minified by
imagemin-lint-staged(only on pre-commit)
There are a few different contexts in which the linters run.
# Lint all files, fixing many violations automatically yarn lint
package.json to update.
Staged files are automatically linted and tested before each commit. See
lint-staged.config.js to update.
In supported editors, all files will be linted and formatted on-save. See editors.md for details.
This boilerplate ships with opinionated defaults, but you can edit each tools configuration in the following config files:
So many configuration files! Why not move more of this to
- Moving all possible configs to
package.jsoncan make it really packed, so that quickly navigating to a specific config becomes difficult.
- When split out into their own file, many tools provide the option of exporting a config from JS. I do this wherever possible, because dynamic configurations are simply more powerful, able to respond to environment variables and much more.