Typescript errors from node_modules

[notaddtry]

Describe the bug

After last updated when I trying to start project i recieve errors from TS, which says that problem is in node_modules files:

 ERROR(TypeScript)  Type parameter declaration expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:91:5

    89 |     This extends object,
    90 |     EventMap extends Record<EventNames, any[]>,
  > 91 |     const EventNames extends keyof any = keyof EventMap,
       |     ^^^^^
    92 | >(
    93 |     ...types: EventNames[]
    94 | ): Dispatch<This, EventMap>;

 ERROR(TypeScript)  ',' expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:91:22

    89 |     This extends object,
    90 |     EventMap extends Record<EventNames, any[]>,
  > 91 |     const EventNames extends keyof any = keyof EventMap,
       |                      ^^^^^^^
    92 | >(
    93 |     ...types: EventNames[]
    94 | ): Dispatch<This, EventMap>;

 ERROR(TypeScript)  ',' expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:91:36

    89 |     This extends object,
    90 |     EventMap extends Record<EventNames, any[]>,
  > 91 |     const EventNames extends keyof any = keyof EventMap,
       |                                    ^^^
    92 | >(
    93 |     ...types: EventNames[]
    94 | ): Dispatch<This, EventMap>;

 ERROR(TypeScript)  ',' expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:91:48

    89 |     This extends object,
    90 |     EventMap extends Record<EventNames, any[]>,
  > 91 |     const EventNames extends keyof any = keyof EventMap,
       |                                                ^^^^^^^^
    92 | >(
    93 |     ...types: EventNames[]
    94 | ): Dispatch<This, EventMap>;

 ERROR(TypeScript)  Expression expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:92:1

    90 |     EventMap extends Record<EventNames, any[]>,
    91 |     const EventNames extends keyof any = keyof EventMap,
  > 92 | >(
       | ^
    93 |     ...types: EventNames[]
    94 | ): Dispatch<This, EventMap>;
    95 |

 ERROR(TypeScript)  Expression expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:93:5

    91 |     const EventNames extends keyof any = keyof EventMap,
    92 | >(
  > 93 |     ...types: EventNames[]
       |     ^^^
    94 | ): Dispatch<This, EventMap>;
    95 |
    96 | export {};

 ERROR(TypeScript)  An element access expression should take an argument.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:93:26

    91 |     const EventNames extends keyof any = keyof EventMap,
    92 | >(
  > 93 |     ...types: EventNames[]
       |                          ^
    94 | ): Dispatch<This, EventMap>;
    95 |
    96 | export {};

 ERROR(TypeScript)  Declaration or statement expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:94:1

    92 | >(
    93 |     ...types: EventNames[]
  > 94 | ): Dispatch<This, EventMap>;
       | ^
    95 |
    96 | export {};
    97 |

 ERROR(TypeScript)  Declaration or statement expected.
 FILE  D:/Work/myproject/front/node_modules/@types/d3-dispatch/index.d.ts:94:2

    92 | >(
    93 |     ...types: EventNames[]
  > 94 | ): Dispatch<This, EventMap>;
       |  ^
    95 |
    96 | export {};
    97 |

[TypeScript] Found 9 errors. Watching for file changes.

I cannot fix this problem by configuring my local tsconfig.json or etc.
Only one thing can help me - I remove typescript option in checker

checker({
    overlay: false,
    // typescript: true,
}),

Reproduction

I reproduce this when i can try to start project by npm run dev with this package.json:

{
  "name": "myproject",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "predev": "npm run lint",
    "dev": "node --max_old_space_size=4096 ./node_modules/vite/bin/vite.js --host",
    "build": "tsc && vite build",
    "preview": "vite preview",
    "lint": "eslint --ext .tsx,.ts ./src"
  },
  "dependencies": {
    "@emotion/react": "~11.11.1",
    "@emotion/styled": "~11.11.0",
    "@hookform/resolvers": "~3.1.0",
    "@mui/icons-material": "~5.14.19",
    "@mui/lab": "5.0.0-alpha.131",
    "@mui/material": "~5.14.20",
    "@mui/x-data-grid": "~6.9.0",
    "@mui/x-date-pickers": "5.0.6",
    "date-fns": "~2.30.0",
    "dhtmlx-gantt": "8.0.1",
    "immer": "~9.0.21",
    "ky": "~0.33.3",
    "ol": "~8.2.0",
    "react": "~18.2.0",
    "react-colorful": "~5.6.1",
    "react-dnd": "~16.0.1",
    "react-dnd-html5-backend": "~16.0.1",
    "react-dom": "~18.2.0",
    "react-hook-form": "~7.43.9",
    "react-resizable": "~3.0.5",
    "react-router-dom": "~6.8.0",
    "reactflow": "~11.7.0",
    "swr": "~2.1.1",
    "use-immer": "~0.8.1",
    "uuid": "~9.0.0",
    "yup": "~1.2.0",
    "zustand": "~4.3.8"
  },
  "devDependencies": {
    "@emotion/babel-plugin": "~11.11.0",
    "@emotion/eslint-plugin": "~11.11.0",
    "@mui/system": "~5.14.20",
    "@types/node": "~18.19.3",
    "@types/react": "~18.0.27",
    "@types/react-dom": "~18.0.10",
    "@types/react-resizable": "~3.0.8",
    "@types/uuid": "~9.0.2",
    "@typescript-eslint/eslint-plugin": "~5.50.0",
    "@typescript-eslint/parser": "~5.50.0",
    "@typescript-eslint/typescript-estree": "~5.50.0",
    "@vitejs/plugin-legacy": "~4.1.1",
    "@vitejs/plugin-react": "~4.1.1",
    "eslint": "~8.33.0",
    "eslint-config-prettier": "~8.6.0",
    "eslint-plugin-prettier": "~4.2.1",
    "eslint-plugin-react": "~7.32.2",
    "eslint-plugin-react-hooks": "~4.6.0",
    "eslint-plugin-react-refresh": "~0.3.4",
    "prettier": "~2.8.3",
    "terser": "~5.24.0",
    "typescript": "~4.9.3",
    "vite": "~4.5.0",
    "vite-plugin-checker": "~0.6.2"
  },
  "browserslist": [
    "Chrome >= 83"
  ],
  "volta": {
    "node": "18.14.2",
  }
}

and this vite.config.json:

export default defineConfig({
    build: {
        rollupOptions: {
            input: {
                planning: resolve(__dirname, 'index.html'),
            },
        },
    },
    optimizeDeps: {
        include: [
            '@emotion/react',
            '@emotion/styled',
            '@mui/material/Tooltip',
            '@mui/material/Popper',
            '@mui/material/Unstable_Grid2',
        ],
    },
    define: {
        'process.env': process.env,
    },
    plugins: [
        checker({
            overlay: false,
            typescript: true,
        }),
        legacy({
            renderModernChunks: false,
        }),
        react({
            babel: {
                plugins: [
                    [
                        '@emotion',
                        {
                            cssPropOptimization: false,
                            importMap: {
                                '@mui/system': {
                                    styled: {
                                        canonicalImport: ['@emotion/styled', 'default'],
                                        styledBaseImport: ['@mui/system', 'styled'],
                                    },
                                },
                                '@mui/material/styles': {
                                    styled: {
                                        canonicalImport: ['@emotion/styled', 'default'],
                                        styledBaseImport: ['@mui/material/styles', 'styled'],
                                    },
                                },
                            },
                        },
                    ],
                ],
            },
        }),
    ],
    resolve: {
        alias: [
            {
                find: '@emotion/react',
                replacement: resolve('.', 'node_modules', '@emotion/react'),
            },
            {
                find: '@mui/material',
                replacement: resolve('.', 'node_modules', '@mui/material'),
            },
        ],
    },
});

and this tsconfig.json:

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "lib": ["DOM", "DOM.Iterable", "ESNext"],
    "allowJs": false,
    "skipLibCheck": true,
    "skipDefaultLibCheck": true,
    "esModuleInterop": false,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
  },
  "include": ["src"],
  "exclude": [
    "src/assets/**/*",
    "node_modules",
    "**/node_modules/*",
    "**/@types/d3-dispatch/**", 
    "**/@types/d3/**" 
  ],
  "references": [{ "path": "./tsconfig.node.json" }]
}

This bug reproduces in @types/d3-dispatch package,which is used by reactflow@11.7.4

Expected behavior

i expected that my project can be started without errors from node_modules

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 11th Gen Intel(R) Core(TM) i5-11400H @ 2.70GHz
    Memory: 7.60 GB / 23.71 GB
  Binaries:
    Node: 16.20.2 - ~\AppData\Local\Volta\tools\image\node\16.20.2\node.EXE
    npm: 8.19.4 - ~\AppData\Local\Volta\tools\image\node\16.20.2\npm.CMD
  Browsers:
    Edge: Chromium (139.0.3405.119)
    Internet Explorer: 11.0.19041.5794

Additional context

No response

Validations

• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[davidenke]

I encounter similar behavior, for files being type checked which are not related to the vite build.
In my case it looks like the check is based on included files by the tsconfig.json, but not the files picked up by vite, which is a library build with explicit entrypoints.

[mbonaci]

It reports errors for peer dependencies and I'd like to avoid installing prettier (and other deps), since I'm not using it:

 ERROR(TypeScript)  Cannot find module 'prettier' or its corresponding type declarations.
 FILE  /abs-path/frontend/node_modules/.pnpm/@svgr+core@8.1.0_typescript@5.9.3/node_modules/@svgr/core/dist/index.d.ts:1:25

  > 1 | import { Options } from 'prettier';
      |                         ^^^^^^^^^^
    2 | import { Config as Config$1 } from 'svgo';
    3 | import { Options as Options$1 } from '@svgr/babel-preset';
    4 | import { TransformOptions } from '@babel/core';

 ERROR(TypeScript)  Cannot find module 'svgo' or its corresponding type declarations.
 FILE  /abs-path/frontend/node_modules/.pnpm/@svgr+core@8.1.0_typescript@5.9.3/node_modules/@svgr/core/dist/index.d.ts:2:36

    1 | import { Options } from 'prettier';
  > 2 | import { Config as Config$1 } from 'svgo';
      |                                    ^^^^^^
    3 | import { Options as Options$1 } from '@svgr/babel-preset';
    4 | import { TransformOptions } from '@babel/core';
    5 |

 ERROR(TypeScript)  Cannot find module 'vscode-languageserver/node' or its corresponding type declarations.
 FILE  /abs-path/frontend/node_modules/.pnpm/vite-plugin-checker@0.11.0_oxlint@1.26.0_oxlint-tsgolint@0.5.0__typescript@5.9.3_vite@7_f802711bcf76c6cc3ce135b58b23069b/node_modules/vite-plugin-checker/dist/checkers/vls/initParams.d.ts:1:34

  > 1 | import { InitializeParams } from 'vscode-languageserver/node';
      |                                  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    2 | import { URI } from 'vscode-uri';
    3 |
    4 | type VlsOptions = ReturnType<typeof getDefaultVLSConfig>;

 ERROR(TypeScript)  Cannot find module 'stylelint' or its corresponding type declarations.
 FILE  /abs-path/frontend/node_modules/.pnpm/vite-plugin-checker@0.11.0_oxlint@1.26.0_oxlint-tsgolint@0.5.0__typescript@5.9.3_vite@7_f802711bcf76c6cc3ce135b58b23069b/node_modules/vite-plugin-checker/dist/types.d.ts:3:28

    1 | import { Worker } from 'node:worker_threads';
    2 | import { ESLint } from 'eslint';
  > 3 | import * as Stylelint from 'stylelint';
      |                            ^^^^^^^^^^^
    4 | import { ConfigEnv, ErrorPayload } from 'vite';
    5 | import { VlsOptions } from './checkers/vls/initParams.js';
    6 | import 'vscode-languageserver/node';

[TypeScript] Found 4 errors. Watching for file changes.

I could declare prettier module, but that's a hack.

Is there a way to exclude imports which originate from node_modules from typechecks?