Parcel 💖 WebExt ?

[aarmn]

Hello everyone

I'm a newbie web developer, It's a long-time I'm programming but I'm into web technologies for less than a year.
As my first serious project I wanna make an extension (and I know its a very dangerous idea), my extensions needs are two types:

1. some libraries which including and browserifying them one by one looked like too much of pain [to be best practice] for me. (background, content_script)
2. A real UI Project with SolidJS, TailwindCSS and some static HTMLs with CSS which have some browser.runtime/chrome.runtime reading sending message and some GraphQL works which its workflow minus some browser.runtime calls look more similar to a normal serverless react project (e.g.: sidebar, page-action, browser-action, setting page?, NewTab override?)

I use MANY APIs, and my main target is Firefox (and I use many Firefox/Chrome only APIs, with platform check and lots of cutting edge APIs hot out of doc pages of browsers) I saw parcel CAN build extensions for me and looked pretty simple to setup. but I have some worries.

1. Can I use multiple parcel for each part? one for background script, one for content scripts and another one for other normal pages (e.g. setting page, sidebar, browser action, page action, ....) and is it a good idea? if not, why? (minus repeated package.json files which looks very redundant with lots of extra download)
2. How well parcel support is in this stuff? to be honest I'm very afraid of not knowing my bug is my bug or parcel's bug! cause I'm too young for this soul sucking debugging sessions
3. Is there a builder which do only a simple library browserify for me and nothing more? (no check or adding any extra thing at all, because it felt like parcel add some stuff even to a totally empty project output)
4. Is there any huge web extension made by parcel?
5. Is there any known issue which can't be solved by normal config hacks?
6. Is there support for manifest version 3?

I would be very greatful if parcel devs and pros help me out!

p.s 1: I know web extension support (recipe) is available but I don't know what a recipe is exactly

[101arrowz]

In theory you can build a web extension with any existing online tutorials, run it through Parcel, and get clean, cross-browser-compatible code as output. You can also use TypeScript, Sass, and other source types that require compilation to JS and CSS wherever you would normally import a JS or CSS file. The recipe is a thorough guide for this.

However manifest version 3 is not supported until #7050 is merged.

[andrevenancio]

Hi everyone.
I've been following that recipe above and I have some issues that I'm not sure how to resolve.

Its very common to have an API from google chrome that requires code like so:

chrome.devtools.panels.create("My Extension",  null, "custom.html");

That fails because custom.html isn't hashed.
So you might think you do:

import html from './custom.html';
chrome.devtools.panels.create("My Extension",  null, html);

But the code injected is :

chrome-extension://lnagpahjcgonelcfmnnkgokcoajacnkh/chrome-extension://lnagpahjcgonelcfmnnkgokcoajacnkh/custom.b5ad61a6.html?1669222457412

Where the chrome-extension is duplicated resulting in a 404.