How can I make eslint/vscode-eslint stop linting .eslintrc?

10.5k Views Asked by At

Problem

I have a bunch of "Problems" in my VS Code PROBLEMS pane from eslint complaining about various JSON issues with my .eslintrc. Linting the directory outside of VS Code does not show me .eslintrc issues. My .eslintrc and .eslintignore files are in my workspace directory (same location as my .vscode directory.

Things I have tried

I tried adding the following entries to my .eslintignore file:

  1. **/.*
  2. **/.eslintrc
  3. .eslintrc
  4. ./.eslintrc

But none of them keep VS Code from showing errors both in the file editor as well as the PROBLEMS pane.

I have added the .eslintrc to the exclude files setting in VS Code and then activated the excluded files filter in the PROBLEMS pane but I don't want to hide the file from the EXPLORER pane.

Question

How can I force VS Code/ESLint/vscode-eslint/the culprit to ignore my .eslintrc while linting inside VS Code?

.eslintrc

{
  extends: 'airbnb',
  parser: 'babel-eslint',
  plugins: [
    'react',
    'jest',
  ],
  env: {
    browser: true,
    node: true,
    es6: true,
    jest/globals: true,
  },
  globals: {
    LOGGING_ENDPOINT: false,
    $: false,
    beautify: false,
    testContext: false,
    page: false,
  },
  settings: {
    react: {
      pragma: 'h',
    },
  },
  rules: {
    import/no-extraneous-dependencies: 'off',
    import/no-unresolved: ['error', { ignore: ['^react$', '^react-dom$'] }],
    import/extensions: 'off',
    react/react-in-jsx-scope: 'off',
    no-underscore-dangle: 'off',
    react/no-danger: 'off',
    no-unused-vars: ['error', { varsIgnorePattern: 'React' }],
    react/require-default-props: 'off',
    function-paren-newline: 'off',
    import/no-named-as-default: 'off',
    object-curly-newline: 'off',
    jest/no-focused-tests: 'error',
  },
}

Thanks!

Solution

The issue was that my .eslintrc was in a weird JSON-esque format and, while ESLint was reading it fine, VS Code was telling me about all of the issues. Once I properly formatted it as JSON, VS Code stopped complaining.

1

There are 1 best solutions below

2
On BEST ANSWER

I think your problem is most related to VS Code rather than ESLint.

The .eslintrc file is used to set rules and configurations for ESLint.

You may open your VS Code User Settings or Workspace Settings (Ctrl+Shift+P > Preferences: Open User Settings), and add some rules so that VS Code can ignore some files, e.g.

  "eslint.options": {
    "extensions": [".js", ".jsx"]
  },
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact"
  ],

See more details about vscode-eslint extension.


Also, if you want to add autofix when saving files, you can add the following to your user/workspace settings:

  "files.autoSave": "off",
  "editor.formatOnSave": true,
  "eslint.autoFixOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll": true,
    "source.organizeImports": true
  },