Stop typescript-eslint/explicit-module-boundary-types to be applied on vue component not using Typescript

Léo Coco picture Léo Coco · Aug 27, 2020 · Viewed 13.5k times · Source

I'm using vue and I just updated @typescript-eslint/eslint-plugin": "^3.10.1". My project contains several components. Some of them are using javascript and others typescript.

Warning

I have this warning for methods inside non typescript components

warning: Missing return type on function (@typescript-eslint/explicit-module-boundary-types)

Question

How could I not apply this rule on .vue file which are not using <script lang="ts"> ?

Answer

Reuel Ribeiro picture Reuel Ribeiro · Sep 8, 2020

So, the purpose of this rule is to ensure exported modules have a clear interface to whomever uses it externally. From the rule page, it seems to make sense to use for .ts files instead of .vue files, but you can judge from your project needs.

For my project, I have used the suggested overrides configuration:

{
  "rules": {
    // disable the rule for all files
    "@typescript-eslint/explicit-module-boundary-types": "off"
  },
  "overrides": [
    {
      // enable the rule specifically for TypeScript files
      "files": ["*.ts", "*.tsx"],
      "rules": {
        "@typescript-eslint/explicit-module-boundary-types": ["error"]
      }
    }
  ]
}

Other than that, I don't think you can have filters for saying on the caught .vue files by eslint, only apply the rule on the ones matched by: 'having <script lang="ts">'.

Maybe you're better off using inline comments for these specifics errors.

Edit

Another solution I see could be to manually list your files on a .eslint.config file.

See Extending your TypeScript linting with Type-Aware Rules and I get errors telling me "The file must be included in at least one of the projects provided" for ideas.

If you do want to lint the file with type-aware linting: Check the include option of each of the tsconfigs that you provide to parserOptions.project - you must ensure that all files match an include glob, or else our tooling will not be able to find it. If your file shouldn't be a part of one of your existing tsconfigs (for example, it is a script/tool local to the repo), then consider creating a new tsconfig (we advise calling it tsconfig.eslint.json) in your project root which lists this file in its include. For an example of this, you can check out the configuration we use in this repo: tsconfig.eslint.json .eslintrc.js