ts

custom_svg_loader.ts

@@ -0,0 +1,20 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+export default function loader(source) {
+
+  console.log('from-loader', this.context);
+
+  source = source.replace(/"([^"]+?\.(png|jpg))"/, (all, unquoted, ext) => {
+    const img_path = path.join(this.context, unquoted);
+    const img_content = fs.readFileSync(img_path);
+    if (img_content instanceof Buffer) {
+      return `"data:image/png;base64,${img_content.toString('base64')}"`;
+    }
+    else {
+      return all;
+    }
+  });
+
+  return source;
+}

custom_webpack.js → custom_webpack.ts

@@ -14,7 +14,7 @@ export default function(context, options) {
             type: 'asset/resource',
             use: [
               {
-                loader: path.resolve('custom_svg_loader.js'),
+                loader: path.resolve('custom_svg_loader.ts'),
                 options: {
                   /* ... */
                 },

docusaurus.config.ts

@@ -204,7 +204,7 @@ const config: Config = {
   } satisfies Preset.ThemeConfig,
 
   plugins: [
-    path.resolve('./custom_webpack.js'),
+    path.resolve('./custom_webpack.ts'),
     [
       "@docusaurus/plugin-ideal-image",
       {