@growsuper/prettier-config

GROW Super Prettier config.

This allows us to declare our Prettier formatting rules in a centralized place and easily use them in any GROW project, keeping our coding style consistent and following best practices.

See the Prettier Options Docs and Option Philosophy for more information.

Configuration

We are overriding two of the Prettier defaults:

singleQuote: true

This is used as all throughout our codebase we're using single quotes as standard except for when inside Vue templates

htmlWhitespaceSensitivity: 'ignore'

This has been set to 'ignore' as Prettier will try to format inline elements with props such as:

<span v-if="showElement">Hi There</span>

into a multi-line:

<span v-if="showElement"
  >Hi There</span>

in an attempt to both shorten the line as well as preserve whitespace. This conflicts with the current settings we have on eslint. For more information on why Prettier tries to format this multiline, please see here: Whitespace-sensitive formatting.

Usage

Install

npm install --save-dev @growsuper/prettier-config

Option 1: prettier key in package.json:

{
  "name": "my-new-project",
  "prettier": "@growsuper/prettier-config"
}

Option 2: create .prettierrc.js in root directory of project

// .prettierrc.js
module.exports = {
  ...require("@growsuper/prettier-config")
};