Code Formatting & Linting

Formatting & linting are important for maintaining consistent formatting across files, while also reducing the amount of Git diffs when working with multiple developers. In order to flag errors and automate formatting, we use a combination of Prettier, Stylelint, ESLint, and EditorConfig.

Config Files

These opinionated settings are configured through the following files (NOTE: These files should not be altered unless absolute necessary):

  • .prettierrc
  • .prettierignore
  • .stylelintrc
  • .editorconfig
  • .eslintrc

npm Packages

If you’re not using one of our boilerplate projects, make sure you install the following npm packages globally or as a dev dependency:

Globally

  • npm i -g prettier
  • npm i -g stylelint
  • npm i -g eslint

Project Dependency

  • npm i --save-dev prettier
  • npm i --save-dev stylelint
  • npm i --save-dev eslint

IDE Plugins

Each of these formatters also has an accompanying plugin for most major IDEs. Make sure to install and enable these to ensure proper linting and auto-formatting.

VS Code

Sublime Text

Atom

Ignoring Errors

  • // prettier-ignore
  • // eslint-disable-next-line
  • // eslint-disable-line