rollup-plugin-web-worker-loader icon indicating copy to clipboard operation
rollup-plugin-web-worker-loader copied to clipboard

`inline: false` and `external: []` causes invalid syntax with multiple outputs

Open mattrossman opened this issue 2 years ago • 1 comments

Given this rollup configuration:

import webWorker from "rollup-plugin-web-worker-loader";

/** @type {import('rollup').RollupOptions} */
export default {
    input: "src/index.js",
    output: [
        {
            file: "dist/index.js",
            format: "cjs",
        },
        {
            file: "dist/index.modern.js",
            format: "es",
        },
    ],
    plugins: [
        webWorker({
            targetPlatform: "browser",
            inline: false,
            external: [],
        }),
    ],
};

This plugin tries to write both rollup outputs to the same destination index.modern.js. This results in a file that is a mixture of CJS and ESM, an invalid syntax that causes errors.

It seems this is because the plugin holds a single mutable filename reference in state.configuredFileName

https://github.com/darionco/rollup-plugin-web-worker-loader/blob/48df45336b9d2527adae5dd50f4bbfd7c19557dc/src/index.js#L37-L46

This mutable value is used as the output destination, which is unstable.

https://github.com/darionco/rollup-plugin-web-worker-loader/blob/48df45336b9d2527adae5dd50f4bbfd7c19557dc/src/plugin/outputOptions.js#L3-L12

I will try to make a PR fix.

mattrossman avatar Jul 16 '22 16:07 mattrossman

Not familiar with writing rollup plugins but I find it strange that options.file is null in generateBundle but not in outputOptions. It seems difficult to lookup the original configured file value for each output in the generateBundle phase. The only unique data I can see is the options.format. I can't remember if rollup lets you define multiple outputs with the same format, but for now I will just pretend each format is a unique output so I can look up the file name from a Map.

mattrossman avatar Jul 16 '22 17:07 mattrossman