Build error when multiple entrypoints use the same resource

jamalsa commented 1 year ago

Summary

If we create an extension which has multiple entrypoints but use the same resource, the build will fail.

For example if we have Firefox plugin with browser_action and sidebar_action and use the same popup.html the build will fail with error Entrypoint output for popup.html (popup.html) not found.

Reproduction

Steps to reproduce:

Create new web extension using command npm create vite-plugin-web-extension

Edit manifest.json and add:

"{{firefox}}.sidebar_action": {
"default_title": "My sidebar",
"default_panel": "popup.html",
"default_icon": "icon/48.png"
}

Open vite.config.ts and set webExtension's browser config to firefox.
Run npm run build

Result:

[web-extension:manifest] Entrypoint output for popup.html (popup.html) not found
error during build:
Error: Entrypoint output for popup.html (popup.html) not found
at findReplacement (file:///C:/Users/abcdx/reproducer/node_modules/vite-plugin-web-extension/dist/index.js:959:11)
at replaceEntrypoint (file:///C:/Users/abcdx/reproducer/node_modules/vite-plugin-web-extension/dist/index.js:970:43)
at renderManifest (file:///C:/Users/abcdx/reproducer/node_modules/vite-plugin-web-extension/dist/index.js:936:3)
at buildExtension (file:///C:/Users/abcdx/reproducer/node_modules/vite-plugin-web-extension/dist/index.js:1057:30)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Object.buildStart (file:///C:/Users/abcdx/reproducer/node_modules/vite-plugin-web-extension/dist/index.js:1137:9)
at async Promise.all (index 5)
at async PluginDriver.hookParallel (file:///C:/Users/abcdx/reproducer/node_modules/rollup/dist/es/shared/node-entry.js:25260:9)
at async file:///C:/Users/abcdx/reproducer/node_modules/rollup/dist/es/shared/node-entry.js:26484:13
at async catchUnfinishedHookActions (file:///C:/Users/abcdx/reproducer/node_modules/rollup/dist/es/shared/node-entry.js:25698:16)

Environment

  System:
    OS: Windows 10 10.0.22621
    CPU: (8) x64 Intel(R) Core(TM) i7-8665U CPU @ 1.90GHz
    Memory: 7.80 GB / 15.75 GB
  Binaries:
    Node: 18.12.1 - ~\scoop\apps\nodejs-lts\current\node.EXE
    Yarn: 3.3.0 - ~\scoop\apps\nodejs-lts\current\yarn.CMD
    npm: 9.1.1 - ~\scoop\apps\nodejs-lts\current\npm.CMD
    pnpm: 7.27.1 - ~\scoop\apps\nodejs-lts\current\pnpm.CMD
  Browsers:
    Edge: Spartan (44.22621.1848.0), Chromium (114.0.1823.58)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    vite: ^4.1.4 => 4.4.2
    vite-plugin-web-extension: ^3.0.1 => 3.1.1

Possible Cause & Fix

I believe the culprit is this line: https://github.com/aklinker1/vite-plugin-web-extension/blob/3bad9ebd057b10d6fc2aa9ce43508f1600b8ccc0/packages/vite-plugin-web-extension/src/build/renderManifest.ts#L64

The splice method will remove the element from generatedFiles array (and bundles[entry]). So if another entry use the same resource it will throw error because the element is already removed.

Possible fix is to use slice method instead:

const [replacement] = generatedFiles.slice(replacementIndex, replacementIndex+1);

aklinker1 commented 1 year ago

Thanks, I've add a test for this case, your solution worked. See #127.

aklinker1 commented 1 year ago

Released in v1.3.2

aklinker1 / vite-plugin-web-extension