Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
ESLint, Prettier & Airbnb Setup

VSCode - ESLint, Prettier & Airbnb Setup

1. Install ESLint & Prettier extensions for VSCode

Optional - Set format on save and any global prettier options

2. Install Packages

npm i -D eslint prettier eslint-plugin-prettier eslint-config-prettier eslint-plugin-node eslint-config-node
npx install-peerdeps --dev eslint-config-airbnb

3. Create .prettierrc for any prettier rules (semicolons, quotes, etc)

4. Create .eslintrc.json file (You can generate with eslint --init if you install eslint globally)

{
  "extends": ["airbnb", "prettier", "plugin:node/recommended"],
  "plugins": ["prettier"],
  "rules": {
    "prettier/prettier": "error",
    "no-unused-vars": "warn",
    "no-console": "off",
    "func-names": "off",
    "no-process-exit": "off",
    "object-shorthand": "off",
    "class-methods-use-this": "off"
  }
}

Reference

@SwiftWinds

This comment has been minimized.

Copy link

@SwiftWinds SwiftWinds commented Dec 27, 2019

Feel free to use https://github.com/paulolramos/eslint-prettier-airbnb-react, which does this whole process automatically via shell script! :)

@peidrao

This comment has been minimized.

Copy link

@peidrao peidrao commented Mar 7, 2020

good man!

@do1con

This comment has been minimized.

Copy link

@do1con do1con commented Mar 23, 2020

thx!

@richwag

This comment has been minimized.

Copy link

@richwag richwag commented May 24, 2020

This is excellent. and thanks to SwiftWinds for making this super easy.

@SwiftWinds

This comment has been minimized.

Copy link

@SwiftWinds SwiftWinds commented May 25, 2020

This is excellent. and thanks to SwiftWinds for making this super easy.

No problem! :D

@LucasAsafe

This comment has been minimized.

Copy link

@LucasAsafe LucasAsafe commented Jul 9, 2020

Tnx, mate!

@blyatmobilebr

This comment has been minimized.

Copy link

@blyatmobilebr blyatmobilebr commented Aug 9, 2020

thank you!

@bryeduria

This comment has been minimized.

Copy link

@bryeduria bryeduria commented Aug 21, 2020

For those of you who do not want the React plugins in the peerdeps, you can also use:

npx install-peerdeps --dev eslint-config-airbnb-base

@adongu

This comment has been minimized.

Copy link

@adongu adongu commented Aug 29, 2020

Feel free to use https://github.com/paulolramos/eslint-prettier-airbnb-react, which does this whole process automatically via shell script! :)

Good man

@roei133

This comment has been minimized.

Copy link

@roei133 roei133 commented Oct 15, 2020

Hi, why the code not fix auto when i press save in the vscode ? its should fix me the code and its not .

@fatihemree

This comment has been minimized.

Copy link

@fatihemree fatihemree commented Nov 3, 2020

Thanks

@DNI9

This comment has been minimized.

Copy link

@DNI9 DNI9 commented Nov 3, 2020

thank you magic man

@ionicArabic

This comment has been minimized.

Copy link

@ionicArabic ionicArabic commented Nov 28, 2020

Good work. Finally I have Prettier working with VS code

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment