Add build support for Chromium with Manifest V3.

This commit is contained in:
Bauke 2022-03-20 19:02:37 +01:00
parent e18714c9f2
commit 62f2188070
Signed by: Bauke
GPG Key ID: C1C0F29952BCF558
5 changed files with 62 additions and 14 deletions

View File

@ -10,8 +10,11 @@
"private": true,
"scripts": {
"start": "vite build -m development --watch",
"start:chromium": "VITE_BROWSER=chromium pnpm start",
"clean": "trash build web-ext-artifacts",
"build": "pnpm clean && vite build && web-ext build --source-dir build && pnpm zip-source",
"build": "pnpm clean && pnpm build:chromium && pnpm build:firefox && pnpm zip-source",
"build:chromium": "VITE_BROWSER=chromium vite build && web-ext build -n queue-chromium-{version}.zip -s build/chromium",
"build:firefox": "VITE_BROWSER=firefox vite build && web-ext build -n queue-firefox-{version}.zip -s build/firefox",
"zip-source": "git archive --format zip --output web-ext-artifacts/queue-source.zip HEAD",
"test": "xo && stylelint 'source/**/*.scss' && tsc && c8 ava"
},

View File

@ -0,0 +1,27 @@
{
"manifest_version": 3,
"name": "Queue",
"description": "A WebExtension for queueing links.",
"version": "0.2.2",
"permissions": [
"contextMenus",
"storage",
"tabs"
],
"icons": {
"128": "assets/queue.png"
},
"action": {
"default_icon": {
"128": "assets/queue.png"
}
},
"options_ui": {
"page": "options/index.html",
"open_in_tab": true
},
"background": {
"service_worker": "background-scripts/initialize.ts",
"type": "module"
}
}

1
source/types.d.ts vendored
View File

@ -13,6 +13,7 @@ declare global {
readonly DEV: boolean;
readonly MODE: string;
readonly PROD: boolean;
readonly VITE_BROWSER: 'chromium' | 'firefox';
}
type HtmComponent = ReturnType<typeof html>;

View File

@ -1,5 +1,6 @@
import fs from 'node:fs';
import path from 'node:path';
import process from 'node:process';
import url from 'node:url';
import {defineConfig} from 'vite';
@ -9,12 +10,34 @@ import preactPreset from '@preact/preset-vite';
import webExtension from 'vite-plugin-web-extension';
const currentDir = path.dirname(url.fileURLToPath(import.meta.url));
const buildDir = path.join(currentDir, 'build');
const sourceDir = path.join(currentDir, 'source');
// Create the Firefox profile if it doesn't already exist.
const targetBrowser = process.env.VITE_BROWSER ?? 'firefox';
process.env.VITE_BROWSER = targetBrowser;
let webExtConfig;
if (targetBrowser === 'chromium') {
fs.mkdirSync(path.join(currentDir, 'chromium'), {recursive: true});
webExtConfig = {
browserConsole: true,
chromiumProfile: 'chromium/',
keepProfileChanges: true,
startUrl: 'chrome://extensions/',
target: 'chromium',
};
} else {
fs.mkdirSync(path.join(currentDir, 'firefox'), {recursive: true});
webExtConfig = {
browserConsole: true,
firefoxProfile: 'firefox/',
keepProfileChanges: true,
startUrl: 'about:debugging#/runtime/this-firefox',
target: 'firefox-desktop',
};
}
const buildDir = path.join(currentDir, 'build', targetBrowser);
export default defineConfig({
build: {
@ -28,15 +51,9 @@ export default defineConfig({
// https://github.com/aklinker1/vite-plugin-web-extension
webExtension({
assets: 'assets',
browser: 'firefox',
manifest: path.join(sourceDir, 'manifest.json'),
webExtConfig: {
browserConsole: true,
firefoxProfile: 'firefox/',
keepProfileChanges: true,
startUrl: 'about:debugging#/runtime/this-firefox',
target: 'firefox-desktop',
},
browser: targetBrowser,
manifest: path.join(sourceDir, `${targetBrowser}-manifest.json`),
webExtConfig,
}),
],
root: sourceDir,