refactor: better scripts and vite-config

packages/main/index.ts

@@ -27,14 +27,14 @@ async function createWindow() {
   if (app.isPackaged) {
     win.loadFile(join(__dirname, '../renderer/index.html'))
   } else {
-    const pkg = await import('../../package.json')
+    // 🚧 Use ['ENV_NAME'] avoid vite:define plugin
-    const url = `http://${pkg.env.HOST || '127.0.0.1'}:${pkg.env.PORT}`
+    const url = `http://${process.env['VITE_DEV_SERVER_HOST']}:${process.env['VITE_DEV_SERVER_PORT']}`
 
     win.loadURL(url)
     win.webContents.openDevTools()
   }
 
-  // Test active push message to Renderer-process.
+  // Test active push message to Renderer-process
   win.webContents.on('did-finish-load', () => {
     win?.webContents.send('main-process-message', (new Date).toLocaleString())
   })

packages/main/vite.config.ts

@@ -1,20 +1,17 @@
-import { builtinModules, createRequire } from 'module'
+import { builtinModules } from 'module'
 import { defineConfig } from 'vite'
-
+import pkg from '../../package.json'
-const require = createRequire(import.meta.url)
-const pkg = require('../package.json')
 
 export default defineConfig({
-  mode: process.env.NODE_ENV,
+  root: __dirname,
-  // root: [path],
   build: {
-    // outDir: [path],
+    outDir: '../../dist/main',
     lib: {
       entry: 'index.ts',
       formats: ['cjs'],
       fileName: () => '[name].cjs',
     },
-    minify: process.env.NODE_ENV === 'production',
+    minify: process.env./* from mode option */NODE_ENV === 'production',
     emptyOutDir: true,
     rollupOptions: {
       external: [

packages/preload/vite.config.ts

@@ -0,0 +1,24 @@
+import { builtinModules } from 'module'
+import { defineConfig } from 'vite'
+import pkg from '../../package.json'
+
+export default defineConfig({
+  root: __dirname,
+  build: {
+    outDir: '../../dist/preload',
+    lib: {
+      entry: 'index.ts',
+      formats: ['cjs'],
+      fileName: () => '[name].cjs',
+    },
+    minify: process.env./* from mode option */NODE_ENV === 'production',
+    emptyOutDir: true,
+    rollupOptions: {
+      external: [
+        'electron',
+        ...builtinModules,
+        ...Object.keys(pkg.dependencies || {}),
+      ],
+    },
+  },
+})

scripts/build.mjs

@@ -1,25 +1,5 @@
-process.env.NODE_ENV = 'production'
-
-import { dirname, join } from 'path'
-import { fileURLToPath } from 'url'
 import { build } from 'vite'
 
-const __dirname = dirname(fileURLToPath(import.meta.url))
+await build({ configFile: 'packages/main/vite.config.ts' })
-
+await build({ configFile: 'packages/preload/vite.config.ts' })
-await build({
-  configFile: 'scripts/vite.config.mjs',
-  root: join(__dirname, '../packages/main'),
-  build: {
-    outDir: '../../dist/main',
-  },
-})
-
-await build({
-  configFile: 'scripts/vite.config.mjs',
-  root: join(__dirname, '../packages/preload'),
-  build: {
-    outDir: '../../dist/preload',
-  },
-})
-
 await build({ configFile: 'packages/renderer/vite.config.ts' })

scripts/watch.mjs

@@ -1,42 +1,34 @@
-process.env.NODE_ENV = 'development'
-
-import { fileURLToPath } from 'url'
-import { join, dirname } from 'path'
-import { createRequire } from 'module'
 import { spawn } from 'child_process'
 import { createServer, build } from 'vite'
 import electron from 'electron'
 
-const __dirname = dirname(fileURLToPath(import.meta.url))
-const require = createRequire(import.meta.url)
-const pkg = require('../package.json')
-
 /**
- * @type {() => Promise<import('rollup').RollupWatcher>}
+ * @type {(server: import('vite').ViteDevServer) => Promise<import('rollup').RollupWatcher>}
  */
-function watchMain() {
+function watchMain(server) {
   /**
    * @type {import('child_process').ChildProcessWithoutNullStreams | null}
    */
   let electronProcess = null
+  const address = server.httpServer.address()
+  const env = Object.assign(process.env, {
+    VITE_DEV_SERVER_HOST: address.address,
+    VITE_DEV_SERVER_PORT: address.port,
+  })
 
   return build({
-    configFile: 'scripts/vite.config.mjs',
+    configFile: 'packages/main/vite.config.ts',
-    root: join(__dirname, '../packages/main'),
+    mode: 'development',
-    build: {
-      outDir: '../../dist/main',
-      watch: true,
-    },
     plugins: [{
       name: 'electron-main-watcher',
       writeBundle() {
         electronProcess && electronProcess.kill()
-        electronProcess = spawn(electron, ['.'], {
+        electronProcess = spawn(electron, ['.'], { stdio: 'inherit', env })
-          stdio: 'inherit',
-          env: Object.assign(process.env, pkg.env),
-        })
       },
     }],
+    build: {
+      watch: true,
+    },
   })
 }
 
@@ -45,18 +37,17 @@ function watchMain() {
  */
 function watchPreload(server) {
   return build({
-    configFile: 'scripts/vite.config.mjs',
+    configFile: 'packages/preload/vite.config.ts',
-    root: join(__dirname, '../packages/preload'),
+    mode: 'development',
-    build: {
-      outDir: '../../dist/preload',
-      watch: true,
-    },
     plugins: [{
       name: 'electron-preload-watcher',
       writeBundle() {
         server.ws.send({ type: 'full-reload' })
       },
     }],
+    build: {
+      watch: true,
+    },
   })
 }
 
@@ -65,4 +56,4 @@ const server = await createServer({ configFile: 'packages/renderer/vite.config.t
 
 await server.listen()
 await watchPreload(server)
-await watchMain()
+await watchMain(server)