search

vitejs / vite

Next generation frontend tooling. It's fast!
http://vite.dev
MIT License
69.1k stars 6.25k forks source link

tsconfig.json uses `tsBuildInfoFile` path pointing to `node_modules`, which conflicts with Yarn PnP idea #18863

Closed Rewwoken closed 12 hours ago

Rewwoken commented 1 day ago

Describe the bug

When using Yarn Berry with Plug'n'Play (PnP) and creating a Vite TypeScript project via yarn create vite, one issue arises that seem to conflict with the principles of Yarn PnP:

Expected Behavior:

Note:
I'm not entirely sure whether this issue stems from Vite itself or if Yarn is responsible for it. Any clarification on this would be helpful.

Reproduction

https://github.com/Rewwoken/vite-tsBuildInfoFile

Steps to reproduce

  1. Clone the repository using git clone git@github.com:Rewwoken/vite-tsBuildInfoFile.git
  2. Run yarn install.
  3. Execute yarn dev.

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.5 LTS 22.04.5 LTS (Jammy Jellyfish)
    CPU: (12) x64 11th Gen Intel(R) Core(TM) i5-11400F @ 2.60GHz
    Memory: 6.44 GB / 7.68 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.17.0 - ~/.nvm/versions/node/v20.17.0/bin/node
    Yarn: 4.5.3 - ~/.nvm/versions/node/v20.17.0/bin/yarn
    npm: 10.9.0 - ~/.nvm/versions/node/v20.17.0/bin/npm

Used Package Manager

yarn

Logs

Click to expand! ```shell vite:config bundled config file loaded in 75.57ms +0ms vite:config using resolved config: { vite:config plugins: [ vite:config 'vite:optimized-deps', vite:config 'vite:watch-package-data', vite:config 'vite:pre-alias', vite:config 'alias', vite:config 'vite:react-babel', vite:config 'vite:react-refresh', vite:config 'vite:modulepreload-polyfill', vite:config 'vite:resolve', vite:config 'vite:html-inline-proxy', vite:config 'vite:css', vite:config 'vite:esbuild', vite:config 'vite:json', vite:config 'vite:wasm-helper', vite:config 'vite:worker', vite:config 'vite:asset', vite:config 'vite:wasm-fallback', vite:config 'vite:define', vite:config 'vite:css-post', vite:config 'vite:worker-import-meta-url', vite:config 'vite:asset-import-meta-url', vite:config 'vite:dynamic-import-vars', vite:config 'vite:import-glob', vite:config 'vite:client-inject', vite:config 'vite:css-analysis', vite:config 'vite:import-analysis' vite:config ], vite:config optimizeDeps: { vite:config include: [ vite:config 'react', vite:config 'react-dom', vite:config 'react/jsx-dev-runtime', vite:config 'react/jsx-runtime' vite:config ], vite:config exclude: [], vite:config needsInterop: [], vite:config extensions: [], vite:config disabled: undefined, vite:config holdUntilCrawlEnd: true, vite:config force: false, vite:config noDiscovery: false, vite:config esbuildOptions: { preserveSymlinks: false, jsx: 'automatic' } vite:config }, vite:config server: { vite:config port: 5173, vite:config strictPort: false, vite:config host: undefined, vite:config https: undefined, vite:config open: false, vite:config proxy: undefined, vite:config cors: true, vite:config headers: {}, vite:config warmup: { clientFiles: [], ssrFiles: [] }, vite:config middlewareMode: false, vite:config fs: { vite:config strict: true, vite:config deny: [ '.env', '.env.*', '*.{crt,pem}', '**/.git/**' ], vite:config allow: [ vite:config '/home/rewwoken/code/vite-tsBuildInfoFile', vite:config '/home/rewwoken/.yarn/berry' vite:config ] vite:config }, vite:config preTransformRequests: true, vite:config perEnvironmentStartEndDuringDev: false, vite:config sourcemapIgnoreList: [Function: isInNodeModules$1] vite:config }, vite:config esbuild: { jsxDev: true, jsx: 'automatic', jsxImportSource: undefined }, vite:config build: { vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config polyfillModulePreload: true, vite:config modulePreload: { polyfill: true }, vite:config outDir: 'dist', vite:config assetsDir: 'assets', vite:config assetsInlineLimit: 4096, vite:config sourcemap: false, vite:config terserOptions: {}, vite:config rollupOptions: { onwarn: [Function: onwarn] }, vite:config commonjsOptions: { include: [ /node_modules/ ], extensions: [ '.js', '.cjs' ] }, vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [ /node_modules/ ] }, vite:config write: true, vite:config emptyOutDir: null, vite:config copyPublicDir: true, vite:config manifest: false, vite:config lib: false, vite:config ssrManifest: false, vite:config ssrEmitAssets: false, vite:config reportCompressedSize: true, vite:config chunkSizeWarningLimit: 500, vite:config watch: null, vite:config cssCodeSplit: true, vite:config minify: 'esbuild', vite:config ssr: false, vite:config emitAssets: false, vite:config createEnvironment: [Function: createEnvironment], vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config cssMinify: true vite:config }, vite:config resolve: { vite:config externalConditions: [ 'node' ], vite:config extensions: [ '.mjs', '.js', '.ts', '.jsx', '.tsx', '.json' ], vite:config dedupe: [ 'react', 'react-dom' ], vite:config noExternal: [], vite:config external: [], vite:config preserveSymlinks: false, vite:config alias: [ vite:config { vite:config find: /^\/?@vite\/env/, vite:config replacement: '/@fs/home/rewwoken/code/vite-tsBuildInfoFile/.yarn/__virtual__/vite-virtual-195ada6da4/3/.yarn/berry/cache/vite-npm-6.0.2-1676a36381-10c0.zip/node_modules/vite/dist/client/env.mjs' vite:config }, vite:config { vite:config find: /^\/?@vite\/client/, vite:config replacement: '/@fs/home/rewwoken/code/vite-tsBuildInfoFile/.yarn/__virtual__/vite-virtual-195ada6da4/3/.yarn/berry/cache/vite-npm-6.0.2-1676a36381-10c0.zip/node_modules/vite/dist/client/client.mjs' vite:config } vite:config ], vite:config mainFields: [ 'module', 'jsnext:main', 'jsnext' ], vite:config conditions: [ 'module', 'node', 'development|production' ], vite:config enableBuiltinNoExternalCheck: false vite:config }, vite:config environments: { vite:config client: { vite:config define: undefined, vite:config resolve: { vite:config externalConditions: [ 'node' ], vite:config extensions: [ '.mjs', '.js', '.ts', '.jsx', '.tsx', '.json' ], vite:config dedupe: [ 'react', 'react-dom' ], vite:config noExternal: [], vite:config external: [], vite:config preserveSymlinks: false, vite:config alias: [ vite:config { vite:config find: /^\/?@vite\/env/, vite:config replacement: '/@fs/home/rewwoken/code/vite-tsBuildInfoFile/.yarn/__virtual__/vite-virtual-195ada6da4/3/.yarn/berry/cache/vite-npm-6.0.2-1676a36381-10c0.zip/node_modules/vite/dist/client/env.mjs' vite:config }, vite:config { vite:config find: /^\/?@vite\/client/, vite:config replacement: '/@fs/home/rewwoken/code/vite-tsBuildInfoFile/.yarn/__virtual__/vite-virtual-195ada6da4/3/.yarn/berry/cache/vite-npm-6.0.2-1676a36381-10c0.zip/node_modules/vite/dist/client/client.mjs' vite:config } vite:config ], vite:config mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ], vite:config conditions: [ 'module', 'browser', 'development|production' ], vite:config enableBuiltinNoExternalCheck: false vite:config }, vite:config keepProcessEnv: false, vite:config consumer: 'client', vite:config optimizeDeps: { vite:config include: [ vite:config 'react', vite:config 'react-dom', vite:config 'react/jsx-dev-runtime', vite:config 'react/jsx-runtime' vite:config ], vite:config exclude: [], vite:config needsInterop: [], vite:config extensions: [], vite:config disabled: undefined, vite:config holdUntilCrawlEnd: true, vite:config force: false, vite:config noDiscovery: false, vite:config esbuildOptions: { preserveSymlinks: false, jsx: 'automatic' } vite:config }, vite:config dev: { vite:config warmup: [], vite:config sourcemap: { js: true }, vite:config sourcemapIgnoreList: [Function: isInNodeModules$1], vite:config preTransformRequests: true, vite:config createEnvironment: [Function: defaultCreateClientDevEnvironment], vite:config recoverable: true, vite:config moduleRunnerTransform: false vite:config }, vite:config build: { vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config polyfillModulePreload: true, vite:config modulePreload: { polyfill: true }, vite:config outDir: 'dist', vite:config assetsDir: 'assets', vite:config assetsInlineLimit: 4096, vite:config sourcemap: false, vite:config terserOptions: {}, vite:config rollupOptions: { onwarn: [Function: onwarn] }, vite:config commonjsOptions: { include: [ /node_modules/ ], extensions: [ '.js', '.cjs' ] }, vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [ /node_modules/ ] }, vite:config write: true, vite:config emptyOutDir: null, vite:config copyPublicDir: true, vite:config manifest: false, vite:config lib: false, vite:config ssrManifest: false, vite:config ssrEmitAssets: false, vite:config reportCompressedSize: true, vite:config chunkSizeWarningLimit: 500, vite:config watch: null, vite:config cssCodeSplit: true, vite:config minify: 'esbuild', vite:config ssr: false, vite:config emitAssets: true, vite:config createEnvironment: [Function: createEnvironment], vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config cssMinify: true vite:config } vite:config }, vite:config ssr: { vite:config define: undefined, vite:config resolve: { vite:config externalConditions: [ 'node' ], vite:config extensions: [ '.mjs', '.js', '.ts', '.jsx', '.tsx', '.json' ], vite:config dedupe: [ 'react', 'react-dom' ], vite:config noExternal: [], vite:config external: [], vite:config preserveSymlinks: false, vite:config alias: [ vite:config { vite:config find: /^\/?@vite\/env/, vite:config replacement: '/@fs/home/rewwoken/code/vite-tsBuildInfoFile/.yarn/__virtual__/vite-virtual-195ada6da4/3/.yarn/berry/cache/vite-npm-6.0.2-1676a36381-10c0.zip/node_modules/vite/dist/client/env.mjs' vite:config }, vite:config { vite:config find: /^\/?@vite\/client/, vite:config replacement: '/@fs/home/rewwoken/code/vite-tsBuildInfoFile/.yarn/__virtual__/vite-virtual-195ada6da4/3/.yarn/berry/cache/vite-npm-6.0.2-1676a36381-10c0.zip/node_modules/vite/dist/client/client.mjs' vite:config } vite:config ], vite:config mainFields: [ 'module', 'jsnext:main', 'jsnext' ], vite:config conditions: [ 'module', 'node', 'development|production' ], vite:config enableBuiltinNoExternalCheck: false vite:config }, vite:config keepProcessEnv: true, vite:config consumer: 'server', vite:config optimizeDeps: { vite:config include: [], vite:config exclude: [], vite:config needsInterop: [], vite:config extensions: [], vite:config disabled: undefined, vite:config holdUntilCrawlEnd: true, vite:config force: false, vite:config noDiscovery: true, vite:config esbuildOptions: { preserveSymlinks: false } vite:config }, vite:config dev: { vite:config warmup: [], vite:config sourcemap: { js: true }, vite:config sourcemapIgnoreList: [Function: isInNodeModules$1], vite:config preTransformRequests: false, vite:config createEnvironment: [Function: defaultCreateDevEnvironment], vite:config recoverable: false, vite:config moduleRunnerTransform: true vite:config }, vite:config build: { vite:config target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config polyfillModulePreload: true, vite:config modulePreload: { polyfill: true }, vite:config outDir: 'dist', vite:config assetsDir: 'assets', vite:config assetsInlineLimit: 4096, vite:config sourcemap: false, vite:config terserOptions: {}, vite:config rollupOptions: { onwarn: [Function: onwarn] }, vite:config commonjsOptions: { include: [ /node_modules/ ], extensions: [ '.js', '.cjs' ] }, vite:config dynamicImportVarsOptions: { warnOnError: true, exclude: [ /node_modules/ ] }, vite:config write: true, vite:config emptyOutDir: null, vite:config copyPublicDir: true, vite:config manifest: false, vite:config lib: false, vite:config ssrManifest: false, vite:config ssrEmitAssets: false, vite:config reportCompressedSize: true, vite:config chunkSizeWarningLimit: 500, vite:config watch: null, vite:config cssCodeSplit: true, vite:config minify: false, vite:config ssr: true, vite:config emitAssets: false, vite:config createEnvironment: [Function: createEnvironment], vite:config cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ], vite:config cssMinify: 'esbuild' vite:config } vite:config } vite:config }, vite:config configFile: '/home/rewwoken/code/vite-tsBuildInfoFile/vite.config.ts', vite:config configFileDependencies: [ '/home/rewwoken/code/vite-tsBuildInfoFile/vite.config.ts' ], vite:config inlineConfig: { vite:config root: undefined, vite:config base: undefined, vite:config mode: undefined, vite:config configFile: undefined, vite:config logLevel: undefined, vite:config clearScreen: undefined, vite:config optimizeDeps: { force: undefined }, vite:config server: { host: undefined } vite:config }, vite:config root: '/home/rewwoken/code/vite-tsBuildInfoFile', vite:config base: '/', vite:config decodedBase: '/', vite:config rawBase: '/', vite:config publicDir: '/home/rewwoken/code/vite-tsBuildInfoFile/public', vite:config cacheDir: '/home/rewwoken/code/vite-tsBuildInfoFile/node_modules/.vite', vite:config command: 'serve', vite:config mode: 'development', vite:config isWorker: false, vite:config mainConfig: null, vite:config bundleChain: [], vite:config isProduction: false, vite:config css: { vite:config transformer: 'postcss', vite:config preprocessorMaxWorkers: 0, vite:config devSourcemap: false, vite:config lightningcss: undefined vite:config }, vite:config json: { namedExports: true, stringify: 'auto' }, vite:config builder: undefined, vite:config preview: { vite:config port: 4173, vite:config strictPort: false, vite:config host: undefined, vite:config https: undefined, vite:config open: false, vite:config proxy: undefined, vite:config cors: true, vite:config headers: {} vite:config }, vite:config envDir: '/home/rewwoken/code/vite-tsBuildInfoFile', vite:config env: { BASE_URL: '/', MODE: 'development', DEV: true, PROD: false }, vite:config assetsInclude: [Function: assetsInclude], vite:config logger: { vite:config hasWarned: false, vite:config info: [Function: info], vite:config warn: [Function: warn], vite:config warnOnce: [Function: warnOnce], vite:config error: [Function: error], vite:config clearScreen: [Function: clearScreen], vite:config hasErrorLogged: [Function: hasErrorLogged] vite:config }, vite:config packageCache: Map(1) { vite:config 'fnpd_/home/rewwoken/code/vite-tsBuildInfoFile' => { vite:config dir: '/home/rewwoken/code/vite-tsBuildInfoFile', vite:config data: { vite:config name: 'vite-tsbuildinfofile', vite:config private: true, vite:config version: '0.0.0', vite:config type: 'module', vite:config scripts: { vite:config dev: 'vite --debug', vite:config build: 'tsc -b && vite build', vite:config lint: 'eslint .', vite:config preview: 'vite preview' vite:config }, vite:config dependencies: { react: '^18.3.1', 'react-dom': '^18.3.1' }, vite:config devDependencies: { vite:config '@eslint/js': '^9.15.0', vite:config '@types/react': '^18.3.12', vite:config '@types/react-dom': '^18.3.1', vite:config '@vitejs/plugin-react': '^4.3.4', vite:config eslint: '^9.15.0', vite:config 'eslint-plugin-react-hooks': '^5.0.0', vite:config 'eslint-plugin-react-refresh': '^0.4.14', vite:config globals: '^15.12.0', vite:config typescript: '~5.6.2', vite:config 'typescript-eslint': '^8.15.0', vite:config vite: '^6.0.1' vite:config }, vite:config packageManager: 'yarn@4.5.3' vite:config }, vite:config hasSideEffects: [Function: hasSideEffects], vite:config setResolvedCache: [Function: setResolvedCache], vite:config getResolvedCache: [Function: getResolvedCache] vite:config }, vite:config set: [Function (anonymous)] vite:config }, vite:config worker: { format: 'iife', plugins: '() => plugins', rollupOptions: {} }, vite:config appType: 'spa', vite:config experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false }, vite:config future: undefined, vite:config ssr: { vite:config target: 'node', vite:config optimizeDeps: { vite:config esbuildOptions: { preserveSymlinks: false }, vite:config include: [], vite:config exclude: [], vite:config needsInterop: [], vite:config extensions: [], vite:config holdUntilCrawlEnd: true, vite:config force: false, vite:config noDiscovery: true vite:config }, vite:config external: [], vite:config noExternal: [], vite:config resolve: { vite:config conditions: [ 'module', 'node', 'development|production' ], vite:config externalConditions: [ 'node' ] vite:config } vite:config }, vite:config dev: { vite:config warmup: [], vite:config sourcemap: { js: true }, vite:config sourcemapIgnoreList: [Function: isInNodeModules$1], vite:config preTransformRequests: false, vite:config createEnvironment: [Function: defaultCreateDevEnvironment], vite:config recoverable: false, vite:config moduleRunnerTransform: false vite:config }, vite:config getSortedPlugins: [Function: getSortedPlugins], vite:config getSortedPluginHooks: [Function: getSortedPluginHooks], vite:config createResolver: [Function: createResolver], vite:config fsDenyGlob: [Function: arrayMatcher], vite:config safeModulePaths: Set(0) {} vite:config } +555ms vite:deps Hash is consistent. Skipping. Use --force to override. +0ms Port 5173 is in use, trying another one... VITE v6.0.2 ready in 837 ms ➜ Local: http://localhost:5174/ ➜ Network: use --host to expose ➜ press h + enter to show help ```

Validations

ArnaudBarre commented 1 day ago

Vite uses node_modules/.cache to store cache the configuration bundle I think? How is this handled for yarn PnP?

hi-ogawa commented 1 day ago
  • However, in Yarn PnP, node_modules is usually not used, making this path misleading.

Can you elaborate if you have any concrete issue with this? Not just recent tsbuildinfo, but Vite has been using node_modules/.vite/deps for a long time and I'm not sure if there's any complaint about creating node_modules directory from yarn pnp users.

Rewwoken commented 19 hours ago
  • However, in Yarn PnP, node_modules is usually not used, making this path misleading.

Can you elaborate if you have any concrete issue with this? Not just recent tsbuildinfo, but Vite has been using node_modules/.vite/deps for a long time and I'm not sure if there's any complaint about creating node_modules directory from yarn pnp users.

I haven’t run into any visible issues yet, as I’ve only recently started trying out Yarn Berry.

When creating this issue, I experimented a bit and noticed that Vite actually uses node_modules for its internal purposes, so I don’t find using it confusing.

However, my concern is whether the path ./node_modules/.tmp/tsconfig.app.tsbuildinfo could potentially lead to issues in the future when using Yarn Berry with PnP, as it seems to imply a reliance on node_modules, which isn't used in PnP environments.

hi-ogawa commented 12 hours ago

Okay, I'm closing this for now. Feel free to report it again if you find a concrete issue.