Skip to content

Formats with Prettier and lints with ESLint+Standard! (✿◠‿◠)

License

Notifications You must be signed in to change notification settings

sheerun/prettier-standard

Folders and files

NameName
Last commit message
Last commit date

Latest commit

1e93300 · Jul 9, 2020
Jul 8, 2020
Apr 23, 2020
Apr 5, 2018
Feb 21, 2017
Jan 19, 2019
Sep 2, 2019
Jan 13, 2017
Sep 28, 2019
Apr 23, 2020
Sep 2, 2019
Jan 19, 2019
Jul 9, 2020
Jul 8, 2020
Apr 23, 2020

Repository files navigation

prettier-standard

Build Status version Modern Node

Formats with prettier (actually prettierx) and lints with eslint preconfigured with standard rules (✿◠‿◠)

You don't have to fix any whitespace errors and waste time configuring eslint presets 😌

Installation

yarn add --dev prettier-standard

If you're using the npm: npm install --save-dev prettier-standard.

You can also install globally with npm install -g prettier-standard

Usage

Prettier-standard is best used with prettier-standard --lint command which formats and lints all non-ignored files in repository. Here's full usage:

Usage
  $ prettier-standard [<glob>]

Options
  --format  Just format all files in current repository
  --lint    Additionally lint code after formatting
  --check   Do not format, just check formatting
  --staged  Run only on staged files
  --changed Run only on changed files
  --since   Run only on changed files since given revision
  --lines   Run only on changed lines (warning: experimental!)
  --stdin   Force reading input from stdin
  --parser  Force parser to use for stdin (default: babel)
  --help    Tells how to use prettier-standard

Examples
  $ prettier-standard --changed --lint
  $ prettier-standard --lint '**/*.{js,css}'
  $ prettier-standard --since master
  $ "precommit": "prettier-standard --lint --staged" # in package.json
  $ echo 'const {foo} = "bar";' | prettier-standard --stdin
  $ echo '.foo { color: "red"; }' | prettier-standard --parser css

Warning: --lines flag should be considered experimental as prettier has issues with range formatting:

Examples

Typically you'll use this in your npm scripts (or package scripts):

{
  "scripts": {
    "format": "prettier-standard --format"
  }
}

We also encourage to use modern-node and lint-staged. You can configure it as follows:

{
  "scripts": {
    "precommit": "lint-staged"
  },
  "lint-staged": {
    "*": ["prettier-standard --lint"]
  }
}

NOTE: Unlike prettier this package simplifies your workflow by making --write flag a default, and allowing for passing code to stdin without additional --stdin flag.

Vim

It's probably best to use ale plugin. It supports multiple fixers, including prettier-standard:

Plug 'w0rp/ale'
let g:ale_fixers = {'javascript': ['prettier_standard']}
let g:ale_linters = {'javascript': ['']}
let g:ale_fix_on_save = 1

Sublime Text 3

It's possible to use 'prettier-standard' with Sublime Text 3.

  1. Install 'prettier-standard' globally according to the installation instructions above.
  2. Find the location of your installed executable file. On a unix based system (like MacOS):
$ which prettier-standard
  1. Copy the location. (e.g. /usr/local/bin/prettier-standard)
  2. Install SublimeJsPrettier according to their installation instructions.
  3. Open SublimeJsPrettier's default settings in Sublime and copy the line: "prettier_cli_path": ""
  4. Open SublimeJsPrettier's user settings in Sublime and add the line with the correct location of the 'prettier-standard' executable.
{
  "prettier_cli_path": "/usr/local/bin/prettier-standard"
}

You can now use 'prettier-standard' in Sublime Text 3 by opening the Command Palette (super + shift + p) and typing JsPrettier: Format Code.

Customizing

You can use .prettierrc for overriding some options, e.g to use semistandard:

{
  "semi": true
}

You can also configure linting by creating appropriate .eslintrc file that will override defaults:

{
  "rules": {
    "eqeqeq": "off"
  }
}

Prettier-standard includes following packages so you don't need to install them in your repository:

  • eslint
  • babel-eslint
  • eslint-config-prettier
  • eslint-config-standard
  • eslint-config-standard-jsx
  • eslint-config-standard-react
  • eslint-config-standard-with-typescript
  • eslint-plugin-import
  • eslint-plugin-jest
  • eslint-plugin-node
  • eslint-plugin-promise
  • eslint-plugin-react
  • eslint-plugin-react-hooks
  • eslint-plugin-standard
  • @typescript-eslint/eslint-plugin
  • @typescript-eslint/parser

Ignoring Files

You can use .prettierignore file for ignoring any files to format, e.g:

dist
.next
**/*.ts

You can also use .eslintignore to format some files, but prevent linting others.

API

prettier-standard exposes the same API as prettier: https://prettier.io/docs/en/api.html

It also exposes one additional method that works similarly to its CLI:

run(cwd, config)

  • cwd - path where to execute prettier-standard
  • config - object configuring execution
    • patterns - patterns to use for formatting files (array of strings)
    • check - whether to check instead of format files (boolean, default: false)
    • lint - whether to perform linting (boolean, default: false)
    • changed - whether to format only changed lines (boolean, experimental, default: false)
    • since - format changes that happened since given branch (string, optional, example: "master")
    • onProcess - callback that is called for each processed file matching pattern: { file, formatted, check, runtime }

LICENSE

MIT