Upgraded manifest.json to manifest.config.ts

package.json

@@ -1,6 +1,6 @@
 {
   "name": "youtube-subscriptions-transfer",
-  "version": "1.8",
+  "version": "1.8.0",
   "type": "module",
   "repository": {
     "type": "git",

src/components/pages/About.svelte

@@ -2,6 +2,7 @@
   import { REPO_URL } from "src/utils/constants";
   import SliderTips from "../tips/Slider_Tips.svelte";
   import TutorialCard from "../Tutorial_Card.svelte";
+
   const { name, version, author } = chrome.runtime.getManifest();
   const extensionID = chrome.runtime.id;
 </script>
@@ -15,12 +16,12 @@
     class="link link-hover"
     target="_blank"
     rel="noreferrer"
-    href={`mailto:${author}`}>{author}</a
+    href={`mailto:${author?.email}`}>{author?.email}</a
   >
 </div>
 <div>
   <span class="font-bold">Source code:</span>
-  <a class="link link-hover" target="_blank" rel="noreferrer" href={REPO_URL}
+  <a class="link link-hover" href={`https://${REPO_URL}`} rel="noreferrer" target="_blank"
     >{REPO_URL}</a
   >
 </div>
@@ -30,7 +31,7 @@
     class="link link-hover"
     target="_blank"
     rel="noreferrer"
-    href="https://biplobsd.github.io">https://biplobsd.github.io</a
+    href="https://biplobsd.github.io">biplobsd.github.io</a
   >
 </div>
 <div>

src/manifest.config.ts

@@ -0,0 +1,56 @@
+import { defineManifest } from "@crxjs/vite-plugin";
+import packageJson from "../package.json";
+
+const { version } = packageJson;
+
+// Convert from Semver (example: 0.1.0-beta6)
+const [major, minor, patch] = version
+  // can only contain digits, dots, or dash
+  .replace(/[^\d.-]+/g, "")
+  // split into version parts
+  .split(/[.-]/);
+
+export default defineManifest({
+  manifest_version: 3,
+  name: "Youtube Subscriptions Transfer",
+  description: "Transferring subscriptions from one YouTube account to another",
+  version: `${major}.${minor}.${patch}`,
+  version_name: version,
+  author: {
+    email: "[email protected]",
+  },
+  homepage_url: "https://biplobsd.github.io/apps/view/yst.md",
+  icons: {
+    "16": "src/assets/icons/icon16.png",
+    "32": "src/assets/icons/icon32.png",
+    "48": "src/assets/icons/icon48.png",
+    "128": "src/assets/icons/icon128.png",
+  },
+  content_scripts: [
+    {
+      matches: ["https://www.youtube.com/*"],
+      js: ["src/content/index.ts"],
+    },
+  ],
+  background: {
+    service_worker: "src/background/index.ts",
+  },
+  options_ui: {
+    page: "src/options/options.html",
+    open_in_tab: false,
+  },
+  action: {
+    default_popup: "src/popup/popup.html",
+    default_icon: {
+      "16": "src/assets/icons/icon16.png",
+      "32": "src/assets/icons/icon32.png",
+      "48": "src/assets/icons/icon48.png",
+      "128": "src/assets/icons/icon128.png",
+    },
+  },
+  permissions: [
+    "tabs",
+    "identity",
+    "storage",
+  ] as chrome.runtime.ManifestPermissions[],
+});

src/utils/constants.ts

@@ -1,5 +1,5 @@
 export const STORIES_URL = ["https://www.youtube.com/"];
-export const REPO_URL = "https://github.com/biplobsd/yst";
+export const REPO_URL = "github.com/biplobsd/yst";
 export const XPATH_URL = `https://raw.githubusercontent.com/biplobsd/yst/main/data/xpaths/v1.6.json`;
 export const AUTH_URL = "https://accounts.google.com/o/oauth2/auth";
 export const REDIRECT_URI =

tsconfig.node.json

@@ -1,11 +1,29 @@
 // vite tsconfig
 {
     "compilerOptions": {
-        "composite": true,
-        "module": "esnext",
-        "moduleResolution": "node",
-        "resolveJsonModule": true,
-        "allowSyntheticDefaultImports": true
+        "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+        "target": "ES2022",
+        "lib": [
+            "ES2023"
+        ],
+        "module": "ESNext",
+        "skipLibCheck": true,
+        /* Bundler mode */
+        "moduleResolution": "bundler",
+        "allowImportingTsExtensions": true,
+        "isolatedModules": true,
+        "moduleDetection": "force",
+        "noEmit": true,
+        /* Linting */
+        "strict": true,
+        "noUnusedLocals": true,
+        "noUnusedParameters": true,
+        "noFallthroughCasesInSwitch": true,
+        "noUncheckedSideEffectImports": true
     },
-    "include": ["vite.config.ts", "manifest.json"]
+    "include": [
+        "vite.config.ts",
+        "src/manifest.config.ts",
+        "package.json"
+    ]
 }

vite.config.ts

@@ -2,7 +2,7 @@ import { crx } from "@crxjs/vite-plugin";
 import { svelte } from "@sveltejs/vite-plugin-svelte";
 import { resolve } from "path";
 import { defineConfig } from "vite";
-import manifest from "./manifest.json";
+import manifest from "./src/manifest.config";
 
 const srcDir = resolve(__dirname, "src");