"@parcel/config-webextension" to interpret manifest.json{5,c} files

[hyperupcall]

🙋 feature request

Simply allowing to use a manifest.json5 or manifest.jsonc file when building a web extension using @parcel/config-webextension

🤔 Expected Behavior

$ yarn run parcel build ./src/manifest.json5
yarn run v1.22.19
warning package.json: License should be a valid SPDX license expression
$ /storage/ur/storage_home/Docs/Programming/repos/Groups/hyperupcall/webext-hyperupcall/node_modules/.bin/parcel build ./src/manifest.json
✨ Built in 3.31s

dist/manifest.json                                  3.91 KB    150ms
dist/_locales/en/messages.json                      1.57 KB    167ms
dist/common.e4607a0f.js                               533 B    2.38s
dist/inject.202e51e4.js                             5.02 KB    765ms
dist/extra-inject.5a849954.js                      18.04 KB    2.38s
dist/github-repo-size.7120cd6e.js                  21.87 KB    766ms
dist/github-history.51583fa4.js                    10.12 KB    2.38s
dist/github-isometric.0fa7c996.css                  2.04 KB    174ms
dist/obelisk.min.0682e224.js                      157.94 KB    2.38s
dist/github-isometric.74037a33.js                  39.91 KB    771ms
...

Content of .parcelrc:

{
	"extends": "@parcel/config-webextension"
}

😯 Current Behavior

$ yarn run parcel build ./src/manifest.json5
yarn run v1.22.19
warning package.json: License should be a valid SPDX license expression
$ /storage/ur/storage_home/Docs/Programming/repos/Groups/hyperupcall/webext-hyperupcall/node_modules/.bin/parcel build ./src/manifest.json5
✨ Built in 595ms

dist/manifest.js    3.63 KB    55ms
Done in 1.01s.

Content of .parcelrc:

{
	"extends": "@parcel/config-webextension"
}

Resulting content of dist/manifest.js:

JSON.parse('{"$schema":"https://json.schemastore.org/webextension.json","name":"hyperupcall","description":"hyperupcall\'s Browser Extension","version":"0.1.0 ... ')

💁 Possible Solution

I guess to modify the webextension transformer to be able to read .json5 and .jsonc files?

🔦 Context

I just would like to use comments in my manifest.json file. Mine is quite long with many parts, so comments to deliminate what is what it important for maintainability.

💻 Examples

Like so:

{
	"$schema": "https://json.schemastore.org/webextension.json",
	"name": "hyperupcall",
	"description": "hyperupcall's Browser Extension",
	"version": "0.1.0",
	"manifest_version": 2,
	"default_locale": "en",
	"author": "Edwin Kofler",
	"homepage_url": "https://github.com/hyperupcall/webext-hyperupcall",
	"background": {
		"scripts": [
			// arxiv
			"js/features/arxiv/background.js",

			// github-repo-size
			"js/features/github-repo-size-background.js",
                        ...

[sergey-shpak]

@mischnic those two feature requests might be implemented together: #8707

[mischnic]

Yeah, see #8707 (comment).

Once arbitrary names work, we could change the parse call in the web extension transformer to also allow these JSON dialects:

parcel/packages/transformers/webextension/src/WebExtensionTransformer.js

Line 410 in eed1e2c

const parsed = parse(code);

[101arrowz]

Half of this is fixed by #9068, but we still may need to use a json5 parser that returns source maps. In the meantime a custom transformer from json5 to json added to your .parcelrc will do the trick.