Reworked build step for the content scripts

Main changes:

- Scripts are now built in 2 steps instead of building every script and
style one at a time;
- Scripts are built as AMD modules;
- Dependencies are automatically injected into resulting manifest.json
file.

.vite/pack-extension.js

@@ -1,8 +1,8 @@
-import {loadManifest} from "./lib/manifest.js";
+import { loadManifest } from "./lib/manifest.js";
 import path from "path";
-import {buildScript, buildStyle} from "./lib/content-scripts.js";
-import {normalizePath} from "vite";
-import {extractInlineScriptsFromIndex} from "./lib/index-file.js";
+import { buildScriptsAndStyles } from "./lib/content-scripts.js";
+import { extractInlineScriptsFromIndex } from "./lib/index-file.js";
+import { normalizePath } from "vite";
 
 /**
  * Build addition assets required for the extension and pack it into the directory.
@@ -11,45 +11,61 @@ import {extractInlineScriptsFromIndex} from "./lib/index-file.js";
 export async function packExtension(settings) {
   const manifest = loadManifest(path.resolve(settings.rootDir, 'manifest.json'));
 
-  // Since we CAN'T really build all scripts and stylesheets in a single build entry, we will run build for every single
-  // one of them in a row. This way, no chunks will be generated. Thanks, ManifestV3!
-  await manifest.mapContentScripts(async (entry) => {
-    if (entry.js) {
-      for (let scriptIndex = 0; scriptIndex < entry.js.length; scriptIndex++) {
-        const builtScriptFilePath = await buildScript({
-          input: path.resolve(settings.rootDir, entry.js[scriptIndex]),
-          outputDir: settings.contentScriptsDir,
-          rootDir: settings.rootDir,
-        });
+  const replacementMapping = await buildScriptsAndStyles({
+    inputs: manifest.collectContentScripts(),
+    outputDir: settings.contentScriptsDir,
+    rootDir: settings.rootDir,
+  });
 
-        entry.js[scriptIndex] = normalizePath(
-          path.relative(
-            settings.exportDir,
-            builtScriptFilePath
+  await manifest.mapContentScripts(async entry => {
+    if (entry.js) {
+      entry.js = entry.js
+        .map(jsSourcePath => {
+          if (!replacementMapping.has(jsSourcePath)) {
+            return [];
+          }
+
+          return replacementMapping.get(jsSourcePath);
+        })
+        .flat(1)
+        .map(pathName => {
+          return normalizePath(
+            path.relative(
+              settings.exportDir,
+              path.join(
+                settings.contentScriptsDir,
+                pathName
+              )
+            )
           )
-        );
-      }
+        });
     }
 
     if (entry.css) {
-      for (let styleIndex = 0; styleIndex < entry.css.length; styleIndex++) {
-        const builtStylesheetFilePath = await buildStyle({
-          input: path.resolve(settings.rootDir, entry.css[styleIndex]),
-          outputDir: settings.contentScriptsDir,
-          rootDir: settings.rootDir
-        });
+      entry.css = entry.css
+        .map(jsSourcePath => {
+          if (!replacementMapping.has(jsSourcePath)) {
+            return [];
+          }
 
-        entry.css[styleIndex] = normalizePath(
-          path.relative(
-            settings.exportDir,
-            builtStylesheetFilePath
+          return replacementMapping.get(jsSourcePath);
+        })
+        .flat(1)
+        .map(pathName => {
+          return normalizePath(
+            path.relative(
+              settings.exportDir,
+              path.join(
+                settings.contentScriptsDir,
+                pathName
+              )
+            )
           )
-        );
-      }
+        })
     }
 
     return entry;
-  });
+  })
 
   manifest.passVersionFromPackage(path.resolve(settings.rootDir, 'package.json'));
   manifest.saveTo(path.resolve(settings.exportDir, 'manifest.json'));