Pesquisa de site

javascript - Como fazer o eslint typescript reconhecer interfaces em arquivos .d.ts?


Eu tenho um projeto vite 3 + vuetify 3 + vue 3 com a extensão volar. Eu tenho interfaces definidas em alguns arquivos .d.ts e também tenho o eslint instalado, mas ele reclama que as interfaces não foram encontradas. Se eu desativar a regra no undefined com isso

"overrides": [
      {
        "files": ["*.vue"],
        "rules": {
          "no-undef": "off"
        }
      }
    ]

então funciona, e o typescript e o volar não têm problemas. Então isso significaria que o eslint não consegue reconhecê-lo.

As dependências do meu pacote parecem assim:

  "dependencies": {
    "@azure/msal-browser": "^2.30.0",
    "@mdi/font": "^7.0.96",
    "@typescript-eslint/eslint-plugin": "^5.40.1",
    "eslint-plugin-vue": "^9.6.0",
    "pinia": "^2.0.23",
    "vue": "^3.2.41",
    "vue-i18n": "^9.2.2",
    "vue-router": "^4.1.5",
    "vuetify": "npm:@vuetify/nightly@next",
    "date-fns": "^2.29.3"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^3.1.2",
    "eslint": "^8.25.0",
    "sass": "^1.55.0",
    "typescript": "^4.8.4",
    "vite": "^3.1.8",
    "vite-plugin-eslint": "^1.8.1",
    "vite-plugin-vuetify": "^1.0.0",
    "vue-cli-plugin-vuetify": "~2.5.8",
    "vue-tsc": "^1.0.8"
  }

e minha configuração do eslint fica assim

{
    "env": {
        "browser": true,
        "es2021": true,
        "node": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended",
        "plugin:vue/essential"
    ],
    "parserOptions": {
        "ecmaVersion": "latest",
        "parser": "@typescript-eslint/parser",
        "sourceType": "module"
    },
    "plugins": [
        "vue",
        "@typescript-eslint"
    ],
    "rules": {
        "@typescript-eslint/no-explicit-any": "error",
        "@typescript-eslint/no-inferrable-types": "error",
        "semi": "error"
    },
    "ignorePatterns": ["dist/**/*.js"],
    "root": true
}

O erro do eslint que eu recebo é este

interface EDB_Matter
'EDB_Matter' is not defined. eslint(no-undef)

Como posso fazer o eslint reconhecer a interface do arquivo .d.ts?

Obrigado

Resposta #1

Recomendamos fortemente que você não use a regra de lint no-undef em projetos TypeScript. As verificações que ela fornece já são fornecidas pelo TypeScript sem a necessidade de configuração - o TypeScript apenas faz isso de maneira significativamente melhor.

https://typescript-eslint.io/linting/troubleshooting#i-get-errors-from-the-no-undef-rule-about-global-variables-not-being-defined-even-though-there-are-no-typescript-errors

Ao usar TypeScript, é recomendado desativar a regra no-undef diretamente, já que o TypeScript já verifica isso e você não precisa se preocupar com isso.

Se você realmente precisa ativar esta regra. Adicione essas interfaces na configuração do eslint:

// .eslintrc.cjs
module.exports = {
  globals: {
    EDB_Matter: true,
    /* ... */
  },
}