ESLint + Standard Guide

I am using yarn as my preferred package manager. I have a personal preference to use standard as my code style and so I wanted to integrate standard with my eslint setup.
I had previously published my old setup which also included prettier but I have realized I wasn't using it so I removed it from my updated setup.

yarn add -D eslint @babel/core @babel/eslint-parser eslint-plugin-node eslint-config-standard eslint-plugin-promise eslint-plugin-import

Here is my .eslintrc

{
  "parser": "@babel/eslint-parser",
  "parserOptions": { "requireConfigFile" : "false" },
  "env": {
    "node": true
  },

  "extends": [
    "eslint:recommended",
    "plugin:node/recommended",
    "standard"
  ],
  "rules": {
    "strict": 0,
    "semi": [2, "never"],
    "quotes": ["error", "single"],
    "comma-dangle": ["error", "never"],
    "no-unused-vars": "error",
    "no-var": "error",
    "arrow-body-style": "off",
    "prefer-arrow-callback": "off",
    "space-before-function-paren": 0
  },

  "settings": {
    "node": {
      "version": "detect"
    }
  }
}

I am using a prettier config file just so that in case I do run the format command in vscode, I get code that does not need too much further formatting. Here is my prettierrc.json.

{
  "arrowParens": "avoid",
  "trailingComma": "none",
  "tabWidth": 2,
  "semi": false,
  "singleQuote": true,
  "printWidth": 150
}

If you are using vscode then add these to your settings.json Accessible by CMD/CTRL + SHIFT + P - Preferences: Open Settings (JSON)

"eslint.validate": [
  "javascript"
]

After this setup just run CMD/CTRL + SHIFT + P and type Reload to access the VSCode reload command. This will keep your terminal windows intact. I don't know if there is a real benefit to doing this but I just prefer it whenever I am modifying VSCode level settings.

Posted on: November 24, 2021

Copyright © 2021 Mustafa Campwala. All rights reserved.