1.0.5 • Published 3 years ago

eslint-config-rmaki v1.0.5

Weekly downloads
5
License
MIT
Repository
github
Last release
3 years ago

My Preferred Eslint and Prettier Setup

ESLint and Prettier setup bundled in a package. Forked from here.

Local / Per Project Install

  1. Install package and deps.
npx install-peerdeps --dev eslint-config-rmaki
  1. Create a .eslintrc file. Your .eslintrc file should look like this:
{
  "extends": ["rmaki"]
}
  1. You can add two scripts to your package.json to lint and/or fix:
"scripts": {
  "lint": "eslint .",
  "lint:fix": "eslint . --fix"
},

With VS Code

  1. Install the ESLint package
  2. Change the following settings:
// These are all my auto-save configs
"editor.formatOnSave": true,
// turn it off for JS and JSX, we will do this via eslint
"[javascript]": {
  "editor.formatOnSave": false
},
"[javascriptreact]": {
  "editor.formatOnSave": false
},
// show eslint icon at bottom toolbar
"eslint.alwaysShowStatus": true,
// tell the ESLint plugin to run on save
"editor.codeActionsOnSave": {
  "source.fixAll": true
},
// Optional BUT IMPORTANT: If you have the prettier extension enabled for other languages like CSS and HTML, turn it off for JS since we are doing it through Eslint already
"prettier.disableLanguages": ["javascript", "javascriptreact", "typescript", "typescriptreact"],

After attempting to lint your file for the first time, you may need to click on 'ESLint' in the bottom right and select 'Allow Everywhere' in the alert window.

Finally you'll usually need to restart VS code. They say you don't need to, but it's never worked for me until I restart.

With Create React App

  1. Run npx install-peerdeps --dev eslint-config-rmaki
  2. Crack open your package.json and replace "extends": "react-app" with "extends": "rmaki"

With Gatsby

  1. Run npx install-peerdeps --dev eslint-config-rmaki
  2. If you have an existing .prettierrc file, delete it.
  3. follow the Local / Per Project Install steps above

With Typescript

Needs some instructions from here