nuxt/eslint

Constant Error: Cannot find module 'typescript'

speechless2 opened this issue · 19 comments

speechless2 commented

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: yarn@1.22.21
  • Builder: -
  • User Config: devtools, modules
  • Runtime Modules: @nuxt/eslint@0.3.13
  • 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

mstflotfy commented

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

shinGangan commented

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.

mstflotfy commented

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.

  • 👍1
  • 👀1
shinGangan commented

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. 🤔

shinGangan commented

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

adamreisnz commented

Still happening when using yarn

antfu commented

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

adamreisnz commented

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": "yarn@4.3.1"
}

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.

antfu commented

@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

adamreisnz commented

I will see what I can do

  • 👍1
adamreisnz commented

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

adamreisnz commented

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

adamreisnz commented

Thank you @antfu !

Revadike commented

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.

antfu commented

Set to false? Not true?

Revadike commented

Set to false? Not true?

We are not using typescript.

Revadike commented

@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: {
...
antfu commented

Please create a new issue with proper minimal reproduction. Thanks