Can't lint .ts files when use vue-eslint-parser

[odanado]

eslint-plugin-vue uses vue-eslint-parser as a parser.
https://github.com/vuejs/eslint-plugin-vue/blob/e8f130c20c0ba6213009e1230a294b0f091e57bb/lib/configs/base.js#L7

I need configure @typescript-eslint/parser in parserOptions.parser so as to lint .ts files.
https://eslint.vuejs.org/user-guide/#usage

.ts files aren't linted, because @typescript-eslint/parser isn't configured in parser options.

reproduction repository: https://github.com/odan-sandbox/vscode-eslint-vue-typescript-reproduction

I suggest that include "typescript" in eslint.validate by checking @ typescript-eslint in plugins or parserOptions.parser.

[dbaeumer]

@odanado this is what is happening now since version 2.x.

I cloned your project but it is unclear to me what you think is not working correctly. Can you please provide steps to reproduce the problem.

[odanado]

reproduction steps

• Run git clone https://github.com/odan-sandbox/vscode-eslint-vue-typescript-reproduction
• Run cd vscode-eslint-vue-typescript-reproduction
• Run yarn install
• Run code .
• Open code/code.js, code/code.ts and code/code.vue in VSCode

captures

code/code.js and code/code.vue have a warning (Replace = with ·=·eslint(prettier/prettier)). But, code/code.ts doesn't have a warning.

code/code.js

code/code.vue

code/code.ts

[dbaeumer]

The reason for this is that although the .eslintrc.js tells to use the @typescript-eslint/parser the eslint npm module tells me that it uses the vue-eslint-parser. Need to understand why this is the case.

[dbaeumer]

The problem is that the parser property is outside the parserOptions. So a correct parser configuration looks like this:

  parser: "@typescript-eslint/parser",
  parserOptions: {
  }

However that doesn't help since vue configuration require the vue-eslint-parser.

[dbaeumer]

Actually in your setup parser seems to be a valid option for the vue-eslint-parser.

[dbaeumer]

See https://github.com/mysticatea/vue-eslint-parser

[ozum]

@dbaeumer, I have same problem with same configuration as @odanado.

VS did not show and/or fix eslint problems for .ts files in Vue project. However

$ node_modules/.bin/eslint src/some.ts

lists errors as expected:

[dbaeumer]

Fixed for 2.0.12

[ozum]

Until 2.0.12 is published as a vs code extension, I would like to share my workaround.

I usually put .ts files in a directory in vue projects. I added a separate .eslintrc.js config file into that directory which is specific to .ts files. It works as expected with vscode-eslint 2.0.11. Hope helps.

[odanado]

I also would like to share my workaround.

Add eslint.validate option in .vscode/settings.json

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "eslint.validate": [
    "typescript"
  ]
}