.eslintrc

{
  "root": true,
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint",
    "simple-import-sort"
  ],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/eslint-recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  "rules": {
    "no-console": 0,
    "semi": [
      2,
      "always"
    ],
    // increase the severity of rules so they are auto-fixable
    "simple-import-sort/imports": "error",
    "simple-import-sort/exports": "error",
    "quotes": [
      2,
      "backtick",
      {
        "allowTemplateLiterals": true
      }
    ],
    "comma-dangle": [
      "error",
      "only-multiline"
    ]
  },
  "overrides": [
    // override "simple-import-sort" config
    {
      "files": [
        "*.js",
        "*.jsx",
        "*.ts",
        "*.tsx"
      ],
      "rules": {
        "simple-import-sort/imports": [
          "error",
          {
            "groups": [
              // Packages `react` related packages come first.
              [
                "^react",
                "^@?\\w"
              ],
              // Internal packages.
              [
                "^(@|components)(/.*|$)"
              ],
              // Side effect imports.
              [
                "^\\u0000"
              ],
              // Parent imports. Put `..` last.
              [
                "^\\.\\.(?!/?$)",
                "^\\.\\./?$"
              ],
              // Other relative imports. Put same-folder imports and `.` last.
              [
                "^\\./(?=.*/)(?!/?$)",
                "^\\.(?!/?$)",
                "^\\./?$"
              ],
              // Style imports.
              [
                "^.+\\.?(css)$"
              ]
            ]
          }
        ]
      }
    }
  ]
}