eslint

eslint copied to clipboard

Environment

Operating System: Linux

• Node Version: v21.6.1
• Nuxt Version: 3.11.2
• CLI Version: 3.11.1
• Nitro Version: 2.9.6
• Package Manager: [email protected]
• Builder: -
• User Config: devtools, modules
• Runtime Modules: @nuxt/[email protected]
• Build Modules: -

Package

@nuxt/eslint

Reproduction

Fresh install of nuxt3 and nuxt-eslint module, just followed the tutorial

Describe the bug

Once i finished the tutorial on how to use:

https://eslint.nuxt.com/packages/module#quick-setup with this command:

npx nuxi module add eslint

and try to yarn lint

i got this error:

Oops! Something went wrong! :(

ESLint: 9.3.0

Error: Cannot find module 'typescript' Require stack:

Additional context

No response

Logs

No response

Just had the same issue. Not sure this is the best approach, but I installed typescript as a dev dependency then it worked.

Hi @speechless2 , @mstflotfy !

I think this problem is specific to yarn, but what do you think?

I conducted experiments with pnpm and npm, but I could not confirm any similar problems. However, a similar problem was confirmed when performing operational experiments with yarn.

Therefore, I don't think it's a yarn issue rather than a Nuxt ESLint issue.

Hey @shinGangan,

I just installed the module using: npx nuxi module add eslint in a fresh bunand npm projects, and it worked without issues. It does seem that this problem is specific to yarn.

Hi @mstflotfy , thanks for your comment! I'm glad the experiment results were the same. 💚

If there is a problem on yarn side, it may be okay to close this issue. 🤔

Hi @speechless2 , has the problem been resolved? Or is it still happening?

Still happening when using yarn

What's the yarn version you are having? Could anyone share a minimal reproduction with the yarn version and lockfile? Thanks

I have used yarn 4.3.1. Here's steps to reproduce:

• Node 22.1.0
• npx nuxi@latest init eslint-issue
• cd eslint-issue
• rm -rf node_modules
• rm -yarn.lock
• yarn set version berry
• yarn config set nodeLinker node-modules
• npx nuxi module add eslint
• I added a couple more ESLint related dependencies:

Package.json

{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "@nuxt/eslint": "^0.3.13",
    "nuxt": "^3.12.2"
  },
  "devDependencies": {
    "@eslint/js": "^9.5.0",
    "eslint": "^9.5.0",
    "eslint-plugin-vue": "^9.26.0"
  },
  "packageManager": "[email protected]"
}

And then create this eslint.config.mjs file in your project root:

import js from '@eslint/js'
import vue from 'eslint-plugin-vue'
import withNuxt from './.nuxt/eslint.config.mjs'

export default withNuxt(
  js.configs.recommended,
  ...vue.configs['flat/recommended'],
  {
    ignores: [
      '*.ts',
      'node_modules',
      'public',
    ],
    languageOptions: {
      ecmaVersion: 'latest',
      sourceType: 'module',
    },
    rules: {
      //Because auto imports -.-
      'no-undef': 'off',
    },
  }
)

Run yarn (and note warning about ESLint version)

eslint is listed by your project with version 9.5.0 (p49b75), which doesn't satisfy what @nuxt/eslint and other dependencies request (^8.57.0).

Restart ESLint server in VSCode, and observe output:

Uncaught exception received.
Error: Cannot find module 'typescript'
Require stack:
- /eslint-issue/node_modules/@typescript-eslint/typescript-estree/dist/convert.js

Unfortunately I can't attach the yarn.lock file as it is too long. But the above steps are just a clean nuxt install and ESLint module addition.

Adding yarn add -D typescript and restarting ESLint server again fixes the issue and ESLint runs fine.

As I don't use TypeScript in the project at all, it's a bit strange that I have to explicitly add it to my package.json, and that there is no easy configuration option to simply disable it so I don't need to use all these related dependencies. How can we opt-out of Typescript?

Let me know if you need any further information.

@adamreisnz Thanks for the info - but I am sorry this is not a reproduction, it's better if you could create a temporary repo with all the files you have. See: https://antfu.me/posts/why-reproductions-are-required

I will see what I can do

Here you go @antfu , let me know if this works for you:

https://github.com/adamreisnz/nuxt-eslint-reproduction/tree/issue-437

I've also put together a reproduction in #461 for the other issue I'm experiencing. In that branch you can see that the linter works once you manually add typescript to the package.json file

Any update on no longer requiring TypeScript when using this module?

Thank you @antfu !

I'm still having this issue with v0.5.1. Even setting features.typescript explicitly to false does not fix it. The only way is to install typescript as dependency.

Set to false? Not true?

Set to false? Not true?

We are not using typescript.

@antfu Here is the error:

[Error - 3:31:03 PM] Calculating config file for file:///home/myproject/eslint.config.js) failed.
Error: Cannot find module 'typescript'
Require stack:
- /home/myproject/node_modules/@typescript-eslint/typescript-estree/dist/convert.js
- /home/myproject/node_modules/@typescript-eslint/typescript-estree/dist/ast-converter.js
- /home/myproject/node_modules/@typescript-eslint/typescript-estree/dist/parser.js
- /home/myproject/node_modules/@typescript-eslint/typescript-estree/dist/index.js
- /home/myproject/node_modules/@typescript-eslint/parser/dist/parser.js
- /home/myproject/node_modules/@typescript-eslint/parser/dist/index.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1152:15)
    at Module._load (node:internal/modules/cjs/loader:993:27)
    at c._load (node:electron/js2c/node_init:2:13801)
    at Module.require (node:internal/modules/cjs/loader:1240:19)
    at require (node:internal/modules/helpers:179:18)
    at Object.<anonymous> (/home/myproject/node_modules/@typescript-eslint/typescript-estree/dist/convert.js:30:25)
    at Module._compile (node:internal/modules/cjs/loader:1373:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1432:10)
    at Module.load (node:internal/modules/cjs/loader:1215:32)
    at Module._load (node:internal/modules/cjs/loader:1031:12)

Our dev dependencies:

  "devDependencies": {
    "@date-io/dayjs": "^3.0.0",
    "@nuxt/devtools": "^1.0.6",
    "@nuxt/eslint": "^0.5.1",
    "@nuxt/types": "^2.17.2",
    "@nuxtjs/google-fonts": "^3.2.0",
    "dotenv": "^16.3.1",
    "eslint": "^9.9.0",
    "eslint-config-vuetify": "^1.0.0",
    "eslint-plugin-vue": "^9.27.0",
    "firebase-tools": "^13.0.1",
    "html-to-vue": "^1.4.0",
    "nuxt": "^3.8.2",
    "sass": "^1.69.5",
    "vite-plugin-vuetify": "^2.0.1",
    "vue": "^3.3.10",
    "vue-eslint-parser": "^9.4.0",
    "vue-router": "^4.2.5",
    "vuetify": "^3.4.7"
  },

Our eslint config:

import js from '@eslint/js'
import vue from 'eslint-plugin-vue'
import vuetify from 'eslint-config-vuetify'
import vueEslintParser from 'vue-eslint-parser'
import withNuxt from './.nuxt/eslint.config.mjs'

export default withNuxt(
  js.configs.recommended,
  ...vue.configs['flat/recommended'],
  {
    files: ['**/*.js', '**/*.vue'],
    languageOptions: {
      parser: vueEslintParser
    },
    ignores: ['dist/*'],
    plugins: { vue },
    rules: {
...

Please create a new issue with proper minimal reproduction. Thanks