electron-renderer(0.10.0): support build.assetsDir 🐞

packages/electron-renderer/src/build-config.ts

@@ -15,7 +15,7 @@ export default function buildConfig(): Plugin {
 
       // ensure that static resources are loaded normally
       // TODO: Automatic splicing `build.assetsDir`
-      config.build.assetsDir ??= ''
+      // config.build.assetsDir ??= ''
 
       // https://github.com/electron-vite/electron-vite-vue/issues/107
       config.build.cssCodeSplit ??= false

packages/electron-renderer/src/cjs-shim.ts

@@ -0,0 +1,61 @@
+import type { ResolvedConfig, Plugin } from 'vite'
+
+export default function cjsShim(): Plugin {
+  let config: ResolvedConfig
+
+  return {
+    name: 'vite-plugin-electron-renderer:cjs-shim',
+    apply: 'build',
+    configResolved(_config) {
+      config = _config
+    },
+    transformIndexHtml(html) {
+      const headRE = /(<\/[\s]*?head[\s]*?>)/
+
+      // ---------------------------------------- shim-exports
+      const output = config.build.rollupOptions.output
+      if (output) {
+        const formats = ['cjs', 'commonjs']
+
+        // https://github.com/electron-vite/vite-plugin-electron/issues/6
+        // https://github.com/electron-vite/vite-plugin-electron/commit/e6decf42164bc1e3801e27984322c41b9c2724b7#r75138942
+        if (
+          Array.isArray(output)
+            // Once an `output.format` is CJS, it is considered as CommonJs
+            ? output.find(o => formats.includes(o.format as string))
+            : formats.includes(output.format as string)
+        ) {
+          // fix(🐞): exports is not defined
+          const exportsShim = `<script id="shim-exports">var exports = typeof module !== 'undefined' ? module.exports : {};</script>`
+          html = html.replace(headRE, exportsShim + '\n$1')
+        }
+      }
+
+      // ---------------------------------------- shim-require-id
+      const assetsDir = config.build.assetsDir
+      if (assetsDir) {
+        const requireIdShim = `<script id="shim-require-id">
+; (function () {
+  var Module = require('module');
+  var _resolveFilename = Module._resolveFilename;
+  Module._resolveFilename = function (request, parent, isMain, options) {
+    // "assetsDir" is always at the same level as "index.html"
+    var prefix = './';
+    if (request.startsWith(prefix)) {
+      try {
+        // TODO: The way is more elegant.
+        var newRequest = request.replace(prefix, prefix + '${assetsDir + "/"}');
+        return _resolveFilename.call(this, newRequest, parent, isMain, options);
+      } catch (error) { }
+    }
+    return _resolveFilename.call(this, request, parent, isMain, options);
+  };
+})();
+</script>`
+        html = html.replace(headRE, requireIdShim + '\n$1')
+      }
+
+      return html
+    }
+  }
+}

packages/electron-renderer/src/index.ts

@@ -1,6 +1,6 @@
-import type { Plugin } from 'vite'
+import type { PluginOption } from 'vite'
 import buildConfig from './build-config'
-import polyfillExports from './polyfill-exports'
+import cjsShim from './cjs-shim'
 import {
   type UseNodeJsOptions,
   default as useNodeJs,
@@ -10,10 +10,10 @@ export { default as worker } from './worker'
 
 export default function renderer(
   options: Omit<UseNodeJsOptions, 'nodeIntegrationInWorker'> = {}
-): Plugin[] {
+): PluginOption {
   return [
     buildConfig(),
-    polyfillExports(),
-    ...useNodeJs(options),
+    options.nodeIntegration && cjsShim(),
+    useNodeJs(options),
   ]
 }