parcel
parcel copied to clipboard
parcel-bundler
Building issues with @parcel/config-webextension if we use custom manifest file name
🐛 bug report
I'm building a web extension and I have separate manifests for both Chrome and Firefox.
Let's say my manifest is named manifest-firefox.json
So, if I try to build my extension by using parcel build src/manifest-firefox.json then it doesn't build the extension and doesn't even throw an error.
When I check the dist directory, I see that it has created only 1 file called: manifest-firefox.js
Whereas if I rename the original manifest file to "manifest.json" and use the command like: parcel build src/manifest.json
Then it successfully builds the extension. (PS: Manifest is unchanged in both the scenarios, only the file is renamed nothing else.)
So it seems that parcel has some bug where it doesn't work with custom named manifests.
🎛 Configuration (.babelrc, package.json, cli command)
I'm not using any babel config. My .parcelrc is below:
{
"extends": "@parcel/config-webextension"
}
🤔 Expected Behavior
Extension should be built correctly even though we supply custom manifest file name
😯 Current Behavior
The extension didn't built properly and I got only 1 file in dist directory named manifest-firefox.js with contents:
JSON.parse('{"//My manifest json here"}
💁 Possible Solution
🔦 Context
Trying to build extension for chrome and firefox with separate manifests
💻 Code Sample
"build-firefox": "parcel build src/manifest-firefox.json --no-content-hash --no-source-maps --dist-dir dist --no-cache --detailed-report 10"
🌍 Your Environment
| Software | Version(s) |
|---|---|
| Parcel | 2.7.0 |
| parcel/config-webextension | 2.7.0 |
| Node | 2.7.0 |
| npm/Yarn | NPM 8.15.0 |
| Operating System | Windows 11 |
@parcel/config-webextension only sets manifest.json as a supported filename. If you want a different name, you have to configure it, otherwise it just treats it as a regular JSON file.
https://github.com/parcel-bundler/parcel/blob/cbc84b0c1d538b0ec15a3bf01f95da3ed623ebbb/packages/configs/webextension/index.json#L3-L10
But I think it's easier to create firefox/manifest.json and chrome/manifest.json
@fregante You are right buddy, I tried this approach too, but there the issue was that I was unable to reference my scripts from the manifests because they are lying in one level up. For example, the structure is like this: scripts, firefox>manifest.json chrome>manifest.json
Now I was unable to reference my scripts and was getting errors if I was using the syntax like:
"service_worker": "../scripts/background/background.js",
Am I missing something?
If there is any way to fix this, then I'll really appreciate it
You're commenting in the wrong issue. The issue you opened is not a bug in Parcel, you just need to add configuration in your .parcelrc as suggested.
The second part is unrelated and already has an issue open.
This issue can be closed.
@fregante Nevermind. Fixed it. The issue is certainly valid though. Parcel should honor the custom manifest name too. Certainly a parcel bug
Not a bug.
parcel build data.json is perfectly valid and is not expected to read the paths within it. If your name is not exactly manifest.json, then Parcel can't assume that every imported json file is a manifest.
There is nothing special to config-webextension other than telling Parcel how to deal with specifically manifest.json. If you use a different name, you can extend the default configuration.
@fregante No, I'm not saying that. I'm saying that simply if we use another name for the manifest like manifest-firefox.json, and supply the same name to Parcel build command, then too it doesn't build. I fixed the second issue myself. I'm not talking about it. Read the issue description properly before commenting
@fregante @akash07k as far as I can understand there is a misunderstanding in implicit knowledge on how to use @parcel/config-webextension.
I think the reason for confusion is that @parcel/config-webextension is using hardcoded manifest.json as manifest file name, but it's not mentioned anywhere in the web extensions getting started docs. A simple NOTE in the docs clarifying that the manifest.json name is hardcoded and mandatory would certainly save people hours of work.
Considering the recent push by google for migrations to manifest v3, a lot of cross-browser extension developers are starting to use separate names for manifest while previously they were usually always using manifest.json. Taking this into consideration would be a great win for all developers.
@piotrwitek Yes, you are quite right. The fact that the manifest name is hardcoded should be mentioned in the docs, or it will be even better if the name customization can be allowed by setting some flags or environment variables.
Since the driver behind this seems to be the need to support two different manifest versions because of the Chrome Store MV3 fiasco, I was wondering if a useful feature might be a transformer that parses some sort of primary manifest file (which could be in JS or JSON5) and cooks it into the appropriate MV2 / MV3 format JSON manifest, depending on which parcel config file we use.
Wins:
- no duplication of mostly similar data to maintain
- can use comments in the manifest
- might be able to pull the version out of our package.json on the fly so there's only a single place to maintain it
@akash07k How did you solve the issue with relative scripts and locales?
The problem I'm facing now, if I create separate manifests, e.g. src/production/manifest.json and src/development/manifest.json, I have to duplicate and copy the _locales folder to each of them, because there is no way to describe a relative path to the _locales folder in the manifest.json.
@everdimension The best way which now use is to simlink your _locales directory. By that, you won't be required to duplicate that dir either, and the workaround will also be made
Does this resolve everyone's concerns regarding different filenames for the manifest?
https://github.com/parcel-bundler/website/pull/1052
