Set [chrome/firefox] build target from CLI

buildTarget.ts

@@ -2,6 +2,3 @@ export const buildTargets = {
   chromium: "chrome",
   firefox: "firefox",
 } as const;
-
-export const buildTarget: (typeof buildTargets)[keyof typeof buildTargets] =
-  buildTargets.chromium;

nodemon.json

@@ -1,13 +1,10 @@
 {
   "env": {
-    "__DEV__": "true"
+    "__DEV__": "true",
+    "BUILD_TARGET": "chrome"
   },
-  "watch": [
-    "src", "utils", "vite.config.ts"
-  ],
-  "ext": "tsx,css,html,ts",
-  "ignore": [
-    "src/**/*.spec.ts"
-  ],
+  "watch": ["src", "utils", "vite.config.ts"],
+  "ext": "tsx,css,html,ts,md",
+  "ignore": ["src/**/*.spec.ts"],
   "exec": "vite build"
 }

package.json

@@ -5,7 +5,8 @@
   "description": "What's UpTab?",
   "author": "Arthur Geel <[email protected]>",
   "scripts": {
-    "build": "vite build",
+    "build:chrome": "BUILD_TARGET=chrome vite build",
+    "build:firefox": "BUILD_TARGET=firefox vite build",
     "dev": "nodemon",
     "test": "vitest",
     "test:watch": "vitest --watch",

src/manifest.ts

@@ -1,7 +1,7 @@
 /* eslint-disable camelcase */
 import type { Manifest } from "webextension-polyfill";
 
-import { buildTargets, buildTarget } from "../buildTarget";
+import { buildTargets } from "../buildTarget";
 import pkg from "../package.json";
 
 const pages = {
@@ -16,7 +16,7 @@ const manifest: Manifest.WebExtensionManifest = {
     default_popup: pages.popup,
   },
   background:
-    buildTarget === buildTargets.firefox
+    process.env.BUILD_TARGET === buildTargets.firefox
       ? {
           page: pages.background.split(".js")[0] + ".html",
         }
@@ -27,7 +27,7 @@ const manifest: Manifest.WebExtensionManifest = {
   chrome_url_overrides: {
     newtab: pages.new,
   },
-  ...(buildTarget === buildTargets.firefox
+  ...(process.env.BUILD_TARGET === buildTargets.firefox
     ? {
         chrome_settings_overrides: {
           homepage: pages.new,
@@ -48,7 +48,7 @@ const manifest: Manifest.WebExtensionManifest = {
       resources: ["icon-128.png", "icon-34.png"],
     },
   ],
-  ...(buildTarget === buildTargets.firefox
+  ...(process.env.BUILD_TARGET === buildTargets.firefox
     ? {
         browser_specific_settings: {
           gecko: {

vite.config.ts

@@ -3,7 +3,7 @@ import { resolve } from "path";
 import react from "@vitejs/plugin-react-swc";
 import { defineConfig } from "vite";
 
-import { buildTargets, buildTarget } from "./buildTarget";
+import { buildTargets } from "./buildTarget";
 import includeChangelog from "./utils/plugins/include-changelog";
 import makeManifest from "./utils/plugins/make-manifest";
 
@@ -12,7 +12,9 @@ const pagesDir = resolve(root, "pages");
 const assetsDir = resolve(root, "assets");
 const outDir = resolve(
   __dirname,
-  buildTarget === buildTargets.firefox ? "dist/firefox" : "dist/chromium"
+  process.env.BUILD_TARGET === buildTargets.firefox
+    ? "dist/firefox"
+    : "dist/chromium"
 );
 const publicDir = resolve(__dirname, "public");
 
@@ -24,7 +26,9 @@ export default defineConfig({
         background: resolve(
           pagesDir,
           "background",
-          buildTarget === buildTargets.firefox ? "index.html" : "index.ts"
+          process.env.BUILD_TARGET === buildTargets.firefox
+            ? "index.html"
+            : "index.ts"
         ),
         newtab: resolve(pagesDir, "newtab", "index.html"),
         popup: resolve(pagesDir, "popup", "index.html"),