Nuxt 3 globals reporting errors

[alexcroox]

Eslint is reporting no-undef errors for global magic functions such as useHead and defineNuxtPlugin

{
  "env": {
    "browser": true,
    "es2021": true,
    "node": true
  },
  "plugins": ["simple-import-sort", "import", "package-json"],
  "extends": ["@nuxtjs", "plugin:prettier/recommended"],

  "rules": {
    "no-console": "off",
    "no-debugger": "off"
  }
}

"@nuxtjs/eslint-config": "10.0.0", "eslint": "8.19.0",

[gregmulvaney]

Nuxt 3 needs @nuxtjs/eslint-config-typescript for magic functions to resolve in ESlint.

[sigtm]

I'm also confused by this. In the readme, it says to install @nuxt/eslint-config, and then under "Usage" it says to install @nuxtjs/eslint-config instead...?

From digging around I saw that the latter is the legacy package. Although the new one is better, it doesn't pick up no-undef errors at all in .vue files on my end. Am I doing it wrong?

const foo = thisDoesntExist();

👆 I was hoping to find a way for ESLint to still pick that one up, while allowing auto-imported stuff like composables.

[edumudu]

I will describe what I got from this trip that can maybe help someone.

This one is the go-to for nuxt 3 and works for typescript also, but seems to be incomplete @nuxt/eslint-config

Those two are legacy ones @nuxtjs/eslint-config @nuxtjs/eslint-config-typescript

For typescript conflict with no-undef you don't even need this package, you just need to disable 'no-undef' rule since this will be handled by the ts itself.

For js I don't tested but maybe this line was supposed to do the trick https://github.com/nuxt/eslint-config/blob/84202f317657eb1dae8e287d74708c4fc4240e28/packages/eslint-config/index.js#L1 but I am not shure.

Also if you are extending some other config after this one, maybe the other config is conflicting and making it not work, for example if you are extending eslint-config-airbnb-base after this one.

And since the @nuxt/eslint-config also extends some others configs https://github.com/nuxt/eslint-config/blob/84202f317657eb1dae8e287d74708c4fc4240e28/packages/eslint-config/index.js#L22, putting this one in the end of your extend array may override your previous configs and since the @nuxt/eslint-config does not add any new rule, you may be better only copy pasting some configs from the file referenced above and pasting in your config, this was the best for me

[Dodje]

Also if you are extending some other config after this one, maybe the other config is conflicting and making it not work, for example if you are extending eslint-config-airbnb-base after this one.

Yeah, airbnb-base really does conflict with nuxt config...

[Revadike]

Dupe of https://github.com/nuxt/eslint-config/issues/309