Search code examples
typescriptvisual-studio-codeeslintvscode-extensionstypescript-eslint

typescript eslint erros and warnings not working in visual studio code


I was using eslint in my project, but I decided to migrate to eslint and did it using @typescript-eslint.

To make the exchange I used the tips provided here: https://github.com/typescript-eslint/tslint-to-eslint-config. This link is inside the typescript-eslint page to guide the switch from tslint to eslint.

However after making the switch the visual studio code is no longer showing the error markings and warnings. I uninstalled the tslint extension and updated eslint. But I couldn't make it work. If I run the eslint check command it works perfectly. But it is as if the visual code ignored eslint in the project.

If anyone can help me I appreciate it.

My packages versions:

"eslint": "^6.7.2",
"@typescript-eslint/eslint-plugin": "^2.12.0"
"@typescript-eslint/eslint-plugin-tslint": "^2.11.0",
"@typescript-eslint/parser": "^2.12.0",
"prettier-eslint": "^9.0.1",
"typescript": "^3.4.5"

My eslint.js:

module.exports = {
    "env": {
        "browser": true,
        "es6": true,
        "node": true
    },
    "extends": [],
    "ignorePatterns": [],
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
        "project": "tsconfig.json",
        "sourceType": "module"
    },
    "plugins": [
        "@typescript-eslint",
        "@typescript-eslint/tslint"
    ],
    "rules": {
        "@typescript-eslint/class-name-casing": "error",
        "@typescript-eslint/consistent-type-definitions": "error",
        "@typescript-eslint/explicit-member-accessibility": [
            "off",
            {
                "accessibility": "explicit"
            }
        ],
        "@typescript-eslint/indent": "warn",
        "@typescript-eslint/member-ordering": [
            "error",
            {
                "default": [
                    "public-static-field",
                    "private-static-field",
                    "public-instance-field",
                    "private-instance-field",
                    "public-static-method",
                    "private-static-method",
                    "public-instance-method",
                    "private-instance-method"
                ]
            }
        ],
        "@typescript-eslint/no-empty-function": "off",
        "@typescript-eslint/no-empty-interface": "error",
        "@typescript-eslint/no-explicit-any": "warn",
        "@typescript-eslint/no-inferrable-types": "error",
        "@typescript-eslint/no-misused-new": "error",
        "@typescript-eslint/no-non-null-assertion": "error",
        "@typescript-eslint/prefer-function-type": "error",
        "@typescript-eslint/quotes": [
            "error",
            "single", { "allowTemplateLiterals": true }
        ],
        "@typescript-eslint/semi": [
            "error",
            "always"
        ],
        "@typescript-eslint/type-annotation-spacing": "error",
        "@typescript-eslint/unified-signatures": "error",
        "camelcase": "off",
        "constructor-super": "error",
        "curly": "error",
        "dot-notation": "off",
        "eol-last": "error",
        "eqeqeq": [
            "error",
            "smart"
        ],
        "guard-for-in": "error",
        "id-blacklist": "off",
        "id-match": "off",
        "max-len": [
            "error",
            {
                "code": 200
            }
        ],
        "no-bitwise": "error",
        "no-caller": "error",
        "no-console": [
            "error",
            {
                "allow": [
                    "log",
                    "dirxml",
                    "warn",
                    "error",
                    "dir",
                    "timeLog",
                    "assert",
                    "clear",
                    "count",
                    "countReset",
                    "group",
                    "groupCollapsed",
                    "groupEnd",
                    "table",
                    "Console",
                    "markTimeline",
                    "profile",
                    "profileEnd",
                    "timeline",
                    "timelineEnd",
                    "timeStamp",
                    "context"
                ]
            }
        ],
        "no-debugger": "error",
        "no-empty": "off",
        "no-eval": "error",
        "no-fallthrough": "error",
        "no-new-wrappers": "error",
        "no-shadow": [
            "error",
            {
                "hoist": "all"
            }
        ],
        "no-throw-literal": "error",
        "no-trailing-spaces": "error",
        "no-undef-init": "error",
        "no-underscore-dangle": "off",
        "no-unused-expressions": "error",
        "no-unused-labels": "error",
        "no-var": "error",
        "prefer-const": "error",
        "radix": "error",
        "spaced-comment": ["error", "always", { "markers": ["#region", "#endregion"] }],
        "valid-typeof": "error",
        "@typescript-eslint/tslint/config": [
            "error",
            {
                "rules": {
                    "component-class-suffix": true,
                    "component-selector": [
                        true,
                        "element",
                        "app",
                        "kebab-case"
                    ],
                    "directive-class-suffix": true,
                    "directive-selector": [
                        true,
                        "attribute",
                        "app",
                        "camelCase"
                    ],
                    "import-blacklist": true,
                    "import-spacing": true,
                    "no-host-metadata-property": true,
                    "no-input-rename": true,
                    "no-inputs-metadata-property": true,
                    "no-output-rename": true,
                    "no-outputs-metadata-property": true,
                    "one-line": true,
                    "use-lifecycle-interface": true,
                    "use-pipe-transform-interface": true,
                    "whitespace": true
                }
            }
        ]
    },
    "settings": {
        "import/parsers": {
            "@typescript-eslint/parser": [".ts", ".tsx"],
        },
        "import/resolver": {
            "typescript": {},
        },
    }
};

My settings.json:

{
    "git.ignoreMissingGitWarning": true,
    "editor.minimap.enabled": false,
    "workbench.colorTheme": "Monokai",
    "editor.autoIndent": false,
    "editor.detectIndentation": false,
    "[html]": {
        "editor.defaultFormatter": "vscode.html-language-features"
    },
    "[javascript]": {
        "editor.defaultFormatter": "vscode.typescript-language-features"
    },
    "typescript.updateImportsOnFileMove.enabled": "always",
    "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": false,
    "typescript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": false,
    "eslint.autoFixOnSave": true,
    "editor.formatOnSave": true,
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "typescript",
            "autoFix": true
        },
        {
            "language": "typescriptreact",
            "autoFix": true
        }
    ]
}

Solution

  • I found that the problem occurred when I had more than one project within the same repository as I count here: https://github.com/microsoft/vscode-eslint/issues/856#issuecomment-567952628

    In the end the problem was an eslint version bug in vscode.