Open linonetwo opened 10 months ago
Can pick manifest.json
in about:debugging#/runtime/this-firefox 's "load temp"
But errors
Extension is invalid
Reading manifest: Error processing background: Value must either: contain the required "page" property, contain the required "scripts" property, or not contain an unexpected "type" property
After running firefox-mv2-build, and load the manifest.json, I get:
Is the service worker generated from code in src/background
? Can Firefox still using it?
I can see in the generated manifect, service-worker-loader.js is not used anymore, so currently Firefox is not supported.
(But I can still use content script that runs when user triggers it. So maybe it is fine.)
I found in dist-firefox-v2/background.html
there is <script type="module" src="./service-worker-loader.js"></script>
, but it is not working, see screenshot above.
Wow, seems it works in production build
I can dev in the Chrome/Edge, and use it in production in Firefox
There is no need to set manifest.manifest_version = 2;
/* eslint-disable unicorn/no-null */
/* eslint-disable @typescript-eslint/no-unsafe-call */
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
/* eslint-disable unicorn/prevent-abbreviations */
/* eslint-disable unicorn/import-style */
// @ts-check
import fs from 'fs-extra';
import * as path from 'path';
const BASE_OUT_DIR = 'dist';
const baseOutDir = path.resolve(BASE_OUT_DIR);
if (!fs.existsSync(baseOutDir)) {
throw new Error(`${BASE_OUT_DIR} dir does not exist. Please run base build first.`);
}
const outDir = `${path.dirname(path.basename(baseOutDir))}/${BASE_OUT_DIR}-firefox-v2`;
fs.copySync(baseOutDir, outDir);
const manifestPath = path.resolve(outDir, 'manifest.json');
const manifest = JSON.parse(fs.readFileSync(manifestPath, 'utf8'));
// manifest.manifest_version = 2;
fs.writeFileSync(
`${outDir}/background.html`,
'<script type="module" src="./service-worker-loader.js"></script>',
);
manifest.background = { page: 'background.html' };
// manifest.browser_action = manifest.action;
// delete manifest.action;
// for (const permission of manifest.host_permissions) {
// manifest.permissions.push(permission === '<all_urls>' ? '*://*/*' : permission);
// }
// delete manifest.host_permissions;
// const temporaryResources = [];
// for (const object of manifest.web_accessible_resources) {
// for (const resource of object.resources) {
// temporaryResources.push(resource);
// }
// }
// manifest.web_accessible_resources = temporaryResources;
fs.writeFileSync(manifestPath, JSON.stringify(manifest, null, 2));
Thank you for reaching out. Firefox Manifest v3 is slightly different from the Chromium Manifest v3. It does not support background.type
which is added by @crxjs/vite-plugin
in build manifest and background.service_worker
. I will add unstable_firefoxMv3
script to the tools
which will output dist-firefox-v3
. Unfortunately, it will not support dev environment as you said.
I see that Firefox MV3 support coming out to crxjs
. It seems it's just for production build and has some issues for now.
see: https://github.com/crxjs/chrome-extension-tools/pull/776 and https://github.com/crxjs/chrome-extension-tools/pull/790
My firefox extionsion is on the store! https://addons.mozilla.org/firefox/addon/tiddlywiki-collector/
https://github.com/tiddly-gittly/Browser-Extension-Tiddlywiki-Collector
Not using background script, do everything in the content script and popup, so it works very good. Despite of some bug in the polyfill https://github.com/mozilla/webextension-polyfill/issues/172#issuecomment-1759980666
Just debug in the firefox is slow, I need to do the full build (to run the to-firefox-script), then reload the extension...No HMR is a pain. And Firefox API is somehow different to the Edge. But overall it is a good experience to dev first on the Edge.
https://extensionworkshop.com/documentation/develop/manifest-v3-migration-guide/
Seems FireFox is also recommending V3. But I found it is impossible to pick dist folder from about:addons of Firefox, why? (After running
pnpm dev
)