Sharing Chunks between main and worker builds not working

[Danielku15]

Describe the bug

I am trying to put a special dependency into a dedicated chunk which should be shared between the "main" build and the "worker" builds.

Vite creates two separate chunks with different content according to whats used in either the worker or main build.

I want one chunk for the dependency exposing everything needed by main and worker files.

---

I think the problem might be somewhere in the area of building the worker entry point here:

vite/packages/vite/src/node/plugins/worker.ts

Lines 71 to 120 in b7ddfae

	const bundle = await rollup({
	...rollupOptions,
	input,
	plugins: await plugins(newBundleChain),
	onwarn(warning, warn) {
	onRollupWarning(warning, warn, config)
	},
	preserveEntrySignatures: false,
	})
	let chunk: OutputChunk
	try {
	const workerOutputConfig = config.worker.rollupOptions.output
	const workerConfig = workerOutputConfig
	? Array.isArray(workerOutputConfig)
	? workerOutputConfig[0] || {}
	: workerOutputConfig
	: {}
	const {
	output: [outputChunk, ...outputChunks],
	} = await bundle.generate({
	entryFileNames: path.posix.join(
	config.build.assetsDir,
	'[name]-[hash].js',
	),
	chunkFileNames: path.posix.join(
	config.build.assetsDir,
	'[name]-[hash].js',
	),
	assetFileNames: path.posix.join(
	config.build.assetsDir,
	'[name]-[hash].[ext]',
	),
	...workerConfig,
	format,
	sourcemap: config.build.sourcemap,
	})
	chunk = outputChunk
	outputChunks.forEach((outputChunk) => {
	if (outputChunk.type === 'asset') {
	saveEmitWorkerAsset(config, outputChunk)
	} else if (outputChunk.type === 'chunk') {
	saveEmitWorkerAsset(config, {
	fileName: outputChunk.fileName,
	source: outputChunk.code,
	})
	}
	})
	} finally {
	await bundle.close()
	}

I guess the fact that we run multiple individual compilation cause separate chunks due to different tree-shaking.

Reproduction

https://stackblitz.com/edit/vitejs-vite-cuquez?view=editor

Steps to reproduce

npm install && npm run build

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 Intel(R) Core(TM) i7-10700K CPU @ 3.80GHz
    Memory: 31.19 GB / 63.92 GB
  Binaries:
    Node: 20.9.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.2.3 - C:\Program Files\nodejs\npm.CMD
    pnpm: 8.15.6 - ~\AppData\Local\pnpm\pnpm.EXE
  Browsers:
    Chrome: 124.0.6367.60
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    vite: ^5.1.4 => 5.2.1
-----------
  System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.18.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.3 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    vite: ^5.1.4 => 5.2.10

Used Package Manager

npm

Logs

Click to expand!

~/projects/vitejs-vite-cuquez
❯ npm run build -- --debug

> [email protected] build
> vite build --debug

  vite:config bundled config file loaded in 496.63ms +0ms
  vite:config using resolved config: {
  vite:config   format: 'es',
  vite:config   worker: {
  vite:config     format: 'es',
  vite:config     plugins: '() => plugins',
  vite:config     rollupOptions: { output: [Object] }
  vite:config   },
  vite:config   build: {
  vite:config     target: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
  vite:config     cssTarget: [ 'es2020', 'edge88', 'firefox78', 'chrome87', 'safari14' ],
  vite:config     outDir: 'dist',
  vite:config     assetsDir: 'assets',
  vite:config     assetsInlineLimit: 4096,
  vite:config     cssCodeSplit: true,
  vite:config     sourcemap: false,
  vite:config     rollupOptions: { output: [Object] },
  vite:config     minify: false,
  vite:config     terserOptions: {},
  vite:config     write: true,
  vite:config     emptyOutDir: null,
  vite:config     copyPublicDir: true,
  vite:config     manifest: false,
  vite:config     lib: false,
  vite:config     ssr: false,
  vite:config     ssrManifest: false,
  vite:config     ssrEmitAssets: false,
  vite:config     reportCompressedSize: true,
  vite:config     chunkSizeWarningLimit: 500,
  vite:config     watch: null,
  vite:config     commonjsOptions: { include: [Array], extensions: [Array] },
  vite:config     dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] },
  vite:config     modulePreload: { polyfill: true },
  vite:config     cssMinify: false
  vite:config   },
  vite:config   configFile: '/home/projects/vitejs-vite-cuquez/vite.config.js',
  vite:config   configFileDependencies: [ '/home/projects/vitejs-vite-cuquez/vite.config.js' ],
  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     build: {}
  vite:config   },
  vite:config   root: '/home/projects/vitejs-vite-cuquez',
  vite:config   base: '/',
  vite:config   rawBase: '/',
  vite:config   resolve: {
  vite:config     mainFields: [ 'browser', 'module', 'jsnext:main', 'jsnext' ],
  vite:config     conditions: [],
  vite:config     extensions: [
  vite:config       '.mjs',  '.js',
  vite:config       '.mts',  '.ts',
  vite:config       '.jsx',  '.tsx',
  vite:config       '.json'
  vite:config     ],
  vite:config     dedupe: [],
  vite:config     preserveSymlinks: false,
  vite:config     alias: [ [Object], [Object] ]
  vite:config   },
  vite:config   publicDir: '/home/projects/vitejs-vite-cuquez/public',
  vite:config   cacheDir: '/home/projects/vitejs-vite-cuquez/node_modules/.vite',
  vite:config   command: 'build',
  vite:config   mode: 'production',
  vite:config   ssr: {
  vite:config     target: 'node',
  vite:config     optimizeDeps: { noDiscovery: true, esbuildOptions: [Object] }
  vite:config   },
  vite:config   isWorker: false,
  vite:config   mainConfig: null,
  vite:config   bundleChain: [],
  vite:config   isProduction: true,
  vite:config   plugins: [
  vite:config     'vite:build-metadata',
  vite:config     'vite:watch-package-data',
  vite:config     'vite:pre-alias',
  vite:config     'alias',
  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:build-html',
  vite:config     'vite:worker-import-meta-url',
  vite:config     'vite:asset-import-meta-url',
  vite:config     'vite:force-systemjs-wrap-complete',
  vite:config     'commonjs',
  vite:config     'vite:data-uri',
  vite:config     'vite:dynamic-import-vars',
  vite:config     'vite:import-glob',
  vite:config     'vite:build-import-analysis',
  vite:config     'vite:esbuild-transpile',
  vite:config     'vite:reporter',
  vite:config     'vite:load-fallback'
  vite:config   ],
  vite:config   css: { lightningcss: undefined },
  vite:config   esbuild: { jsxDev: false },
  vite:config   server: {
  vite:config     preTransformRequests: true,
  vite:config     sourcemapIgnoreList: [Function: isInNodeModules$1],
  vite:config     middlewareMode: false,
  vite:config     fs: {
  vite:config       strict: true,
  vite:config       allow: [Array],
  vite:config       deny: [Array],
  vite:config       cachedChecks: undefined
  vite:config     }
  vite:config   },
  vite:config   preview: {
  vite:config     port: undefined,
  vite:config     strictPort: undefined,
  vite:config     host: undefined,
  vite:config     https: undefined,
  vite:config     open: undefined,
  vite:config     proxy: undefined,
  vite:config     cors: undefined,
  vite:config     headers: undefined
  vite:config   },
  vite:config   envDir: '/home/projects/vitejs-vite-cuquez',
  vite:config   env: { BASE_URL: '/', MODE: 'production', DEV: false, PROD: true },
  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/projects/vitejs-vite-cuquez' => {
  vite:config       dir: '/home/projects/vitejs-vite-cuquez',
  vite:config       data: [Object],
  vite:config       hasSideEffects: [Function: hasSideEffects],
  vite:config       webResolvedImports: {},
  vite:config       nodeResolvedImports: {},
  vite:config       setResolvedCache: [Function: setResolvedCache],
  vite:config       getResolvedCache: [Function: getResolvedCache]
  vite:config     },
  vite:config     set: [Function (anonymous)]
  vite:config   },
  vite:config   createResolver: [Function: createResolver],
  vite:config   optimizeDeps: {
  vite:config     holdUntilCrawlEnd: true,
  vite:config     esbuildOptions: { preserveSymlinks: false }
  vite:config   },
  vite:config   appType: 'spa',
  vite:config   experimental: { importGlobRestoreExtension: false, hmrPartialAccept: false },
  vite:config   getSortedPlugins: [Function: getSortedPlugins],
  vite:config   getSortedPluginHooks: [Function: getSortedPluginHooks]
  vite:config } +10ms
vite v5.2.10 building for production...
✓ 5 modules transformed.
dist/assets/worker-J71E7yqu.js                0.15 kB
dist/assets/test-dependency-core-Dy4zQDPF.js  0.16 kB
dist/index.html                               0.41 kB │ gzip: 0.28 kB
dist/assets/test-dependency-core-BMEBDSVQ.js  0.16 kB │ gzip: 0.12 kB
dist/assets/index-0ifXtuHu.js                 1.56 kB │ gzip: 0.68 kB
✓ built in 232ms
</details>

### Validations

- [X] Follow our [Code of Conduct](https://github.com/vitejs/vite/blob/main/CODE_OF_CONDUCT.md)
- [X] Read the [Contributing Guidelines](https://github.com/vitejs/vite/blob/main/CONTRIBUTING.md).
- [X] Read the [docs](https://vitejs.dev/guide).
- [X] Check that there isn't [already an issue](https://github.com/vitejs/vite/issues) that reports the same bug to avoid creating a duplicate.
- [X] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to [vuejs/core](https://github.com/vuejs/core) instead.
- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vitejs/vite/discussions) or join our [Discord Chat Server](https://chat.vitejs.dev/).
- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.

[bolt-new-by-stackblitz[bot]]

Start a new pull request in StackBlitz Codeflow.

• vitejs-vite-cuquez (Open reproduction)

[Danielku15]

Side info: I also tried to disable tree-shaking (setting treeshake: false in all rollupOptions) but the export list at the bottom is still changing resulting in separate chunk hashes. This seem to be a Rollup problem.

[bluwy]

I moved this as a discussion as I don't think this is a bug in Vite, but probably a configuration issue. Currently with two Rollup builds, there's no way to ensure to two chunks will contain the same contain to be able to share them. The reason we have two Rollup builds is to also ensure to not share the chunks, because worker builds have different resolving and runtime behaviour than normal browser builds, e.g. access to ESM, worker-specific globals etc.

If you do want to make this work and understand the risks of the above, you could write a Rollup plugin using https://rollupjs.org/plugin-development/#this-emitfile and prebuilt-chunk to refer to an existing chunk when building so that you don't rebundle the chunk in the second build, however this is tricky to implement.