web_accessible_resources not compiled to dist

[adenix]

Summary

Including 'web_accessible_resources' in the manifest file does not result in those resources being compiled to the dist folder.

Reproduction

Add a web_accessible_resources block to the manifest.json file.

{
  ...
  "web_accessible_resources": [
    {
      "resources": ["src/settings.html", "src/settings.tsx"],
      "matches": ["<all_urls>"]
    }
  ],
  ...
}

Environment

  System:
    OS: macOS 14.4.1
    CPU: (12) arm64 Apple M3 Pro
    Memory: 90.86 MB / 18.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 21.7.1 - /opt/homebrew/bin/node
    Yarn: 1.22.22 - ~/.nvm/versions/node/v21.7.1/bin/yarn
    npm: 10.5.0 - ~/Developer/AdmitOne/ice-skates/node_modules/.bin/npm
    pnpm: 8.15.5 - ~/.nvm/versions/node/v21.7.1/bin/pnpm
  Browsers:
    Chrome: 124.0.6367.93
    Edge: 124.0.2478.67
    Safari: 17.4.1
  npmPackages:
    vite: ^5.0.0 => 5.2.6 
    vite-plugin-web-extension: ^4.0.0 => 4.1.3 

[mostafa-hisham]

I have the same issue

[braincomb]

+1

Same issue. One workaround would be to place the web accessible content inside a public directory and update the resources path accordingly.

[aklinker1]

Ahh, I see, you're expecting the files to be copied into dist/ for you... Unfortunately the plugin doesn't do this, it probably should, but I'm not adding any more features to this package myself.

I'd recommend putting the files into the public directory if they're assets that don't need to be processed by Vite, or if they do (like shown in the original issue), add the inputs to additonalInputs to have Vite bundle them.

[FabienCH]

Hello,

I also need to build ts files. Sorry I'm new to web extension and vite but where does additonalInputs come from ? I couldn't find it in vite-plugin-web-extension`'s doc or vite's doc.

[aklinker1]

https://vite-plugin-web-extension.aklinker1.io/config/plugin-options.html#additionalinputs