vite build fails when a WebWorker uses import(): Invalid value "iife" for option "output.format" - UMD and IIFE output formats are not supported for code-splitting builds.

[sgielen]

Describe the bug

I am encountering this build issue in an example repository when I run yarn build. I have minimized the issue to this bug report.

I have the following Javascript simply exporting a class, constructor.js:

class MyClass {
  constructor() {}
}

export default MyClass;

Then, a WebWorker implementation loads this class and then does nothing with it:

/* eslint-disable complexity */
import { expose } from 'comlink';

const obj = {
  decodeTask() {
    import('./constructor')
      .then((module) => {
        console.log(module);
      });
  },
};

expose(obj);

The main.ts simply mentions the web worker:

const workerFn = () => {
  const instance = new Worker(
    new URL('./worker.js', import.meta.url),
    { type: 'module' }
  );
  return instance;
};

// mention the file, don't need to do anything with it to reproduce
workerFn;

document.getElementById('app').textContent = "loaded"

With this code, I would expect yarn build to succeed and build an application that contains a web worker, but does nothing when it starts. However, it fails with the following error:

yarn run v1.22.22
$ vite build
vite v5.4.10 building for production...
✓ 2 modules transformed.
x Build failed in 57ms
error during build:
[vite:worker-import-meta-url] Invalid value "iife" for option "output.format" - UMD and IIFE output formats are not supported for code-splitting builds.
file: /Users/sjors/Werk/Yan/vite-reproduction-scenario/src/main.ts
    at getRollupError (file:///.../vite-reproduction-scenario/node_modules/rollup/dist/es/shared/parseAst.js:395:41)
    at error (file:///.../vite-reproduction-scenario/node_modules/rollup/dist/es/shared/parseAst.js:391:42)
    at validateOptionsForMultiChunkOutput (file:///.../vite-reproduction-scenario/node_modules/rollup/dist/es/shared/node-entry.js:19124:16)
    at Bundle.generate (file:///.../vite-reproduction-scenario/node_modules/rollup/dist/es/shared/node-entry.js:19018:17)
    at async file:///.../vite-reproduction-scenario/node_modules/rollup/dist/es/shared/node-entry.js:21704:27
    at async catchUnfinishedHookActions (file:///.../vite-reproduction-scenario/node_modules/rollup/dist/es/shared/node-entry.js:21092:16)
    at async bundleWorkerEntry (file:///.../vite-reproduction-scenario/node_modules/vite/dist/node/chunks/dep-BWSbWtLw.js:47631:9)
    at async workerFileToUrl (file:///.../vite-reproduction-scenario/node_modules/vite/dist/node/chunks/dep-BWSbWtLw.js:47693:25)
    at async Object.transform (file:///.../vite-reproduction-scenario/node_modules/vite/dist/node/chunks/dep-BWSbWtLw.js:48130:26)
    at async transform (file:///.../vite-reproduction-scenario/node_modules/rollup/dist/es/shared/node-entry.js:19597:16)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

If I move the module.default piece to outside the web worker, the yarn build succeeds, so it must be a combination of the two.

Reproduction

https://stackblitz.com/edit/vitejs-vite-7cfaoa?file=index.html&terminal=dev

Steps to reproduce

On the Stackblitz link above, open an additional terminal, and run yarn build in it.

The same example is available here:
vite-reproduction-scenario.tgz

Or, you can use the code from the description above - use dependency "comlink": "^4.4.1" and use /src/main.ts as main module script.

System Info

System:
    OS: macOS 15.0.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 112.50 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.8.0 - /opt/homebrew/bin/node
    Yarn: 1.22.22 - /opt/homebrew/bin/yarn
    npm: 10.8.2 - /opt/homebrew/bin/npm
  Browsers:
    Chrome: 130.0.6723.92
    Safari: 18.0.1

Used Package Manager

yarn

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• 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 instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[hi-ogawa]

Currently worker output for build is defined by https://vite.dev/config/worker-options.html#worker-format and not by new Worker(..., { type }) constructor. Here is an updated config https://stackblitz.com/edit/vitejs-vite-1gekxp?file=vite.config.ts

In Vite 6, the error message should indicate worker.format config #18165, but I guess this behavior of ignoring { type: "module" } might be still confusing. It looks like there is an attempt to make output format adaptable in #8488 and some related discussions in #8466. I'm not sure what's the current direction.

[sgielen]

Thank you very much @hi-ogawa - worker.format = 'es'; indeed seems to resolve the issue. If I understand you correctly there is still something to improve here on the Vite side, so I'll leave this issue open. Thank you!