feat(template-vite): patch types (#3494)

electron · Feb 21, 2024 · 05ced0e · 05ced0e
1 parent df984cb
commit 05ced0e
Show file tree

Hide file tree

Showing 13 changed files with 78 additions and 29 deletions.
diff --git a/packages/template/vite-typescript/tmpl/forge.env.d.ts b/packages/template/vite-typescript/tmpl/forge.env.d.ts
@@ -15,14 +15,17 @@ declare global {
   }
 
   type VitePluginConfig = ConstructorParameters<typeof import('@electron-forge/plugin-vite').VitePlugin>[0];
-  type ForgeConfigEnv<K extends keyof VitePluginConfig = keyof VitePluginConfig> = import('vite').ConfigEnv & {
-    root: string;
-    forgeConfig: VitePluginConfig;
-    forgeConfigSelf: VitePluginConfig[K][number];
-  };
 
   interface VitePluginRuntimeKeys {
     VITE_DEV_SERVER_URL: `${string}_VITE_DEV_SERVER_URL`;
     VITE_NAME: `${string}_VITE_NAME`;
   }
 }
+
+declare module 'vite' {
+  interface ConfigEnv<K extends keyof VitePluginConfig = keyof VitePluginConfig> {
+    root: string;
+    forgeConfig: VitePluginConfig;
+    forgeConfigSelf: VitePluginConfig[K][number];
+  }
+}
diff --git a/packages/template/vite-typescript/tmpl/tsconfig.json b/packages/template/vite-typescript/tmpl/tsconfig.json
@@ -11,6 +11,5 @@
     "outDir": "dist",
     "moduleResolution": "node",
     "resolveJsonModule": true
-  },
-  "include": ["src"]
+  }
 }
diff --git a/packages/template/vite-typescript/tmpl/vite.base.config.ts b/packages/template/vite-typescript/tmpl/vite.base.config.ts
@@ -1,13 +1,13 @@
 import { builtinModules } from 'node:module';
 import type { AddressInfo } from 'node:net';
-import type { Plugin, UserConfig } from 'vite';
+import type { ConfigEnv, Plugin, UserConfig } from 'vite';
 import pkg from './package.json';
 
 export const builtins = ['electron', ...builtinModules.map((m) => [m, `node:${m}`]).flat()];
 
 export const external = [...builtins, ...Object.keys('dependencies' in pkg ? (pkg.dependencies as Record<string, unknown>) : {})];
 
-export function getBuildConfig(env: ForgeConfigEnv<'build'>): UserConfig {
+export function getBuildConfig(env: ConfigEnv<'build'>): UserConfig {
   const { root, mode, command } = env;
 
   return {
@@ -39,7 +39,7 @@ export function getDefineKeys(names: string[]) {
   }, define);
 }
 
-export function getBuildDefine(env: ForgeConfigEnv<'build'>) {
+export function getBuildDefine(env: ConfigEnv<'build'>) {
   const { command, forgeConfig } = env;
   const names = forgeConfig.renderer.filter(({ name }) => name != null).map(({ name }) => name!);
   const defineKeys = getDefineKeys(names);

diff --git a/packages/template/vite-typescript/tmpl/vite.main.config.ts b/packages/template/vite-typescript/tmpl/vite.main.config.ts
@@ -1,11 +1,12 @@
-import { type UserConfig, defineConfig, mergeConfig } from 'vite';
+import type { ConfigEnv, UserConfig } from 'vite';
+import { defineConfig, mergeConfig } from 'vite';
 import { getBuildConfig, getBuildDefine, external, pluginHotRestart } from './vite.base.config';
 
 // https://vitejs.dev/config
 export default defineConfig((env) => {
-  const forgeConfigEnv = env as ForgeConfigEnv<'build'>;
-  const { forgeConfigSelf } = forgeConfigEnv;
-  const define = getBuildDefine(forgeConfigEnv);
+  const forgeEnv = env as ConfigEnv<'build'>;
+  const { forgeConfigSelf } = forgeEnv;
+  const define = getBuildDefine(forgeEnv);
   const config: UserConfig = {
     build: {
       lib: {
@@ -25,5 +26,5 @@ export default defineConfig((env) => {
     },
   };
 
-  return mergeConfig(getBuildConfig(forgeConfigEnv), config);
+  return mergeConfig(getBuildConfig(forgeEnv), config);
 });
diff --git a/packages/template/vite-typescript/tmpl/vite.preload.config.ts b/packages/template/vite-typescript/tmpl/vite.preload.config.ts
@@ -1,9 +1,11 @@
-import { type UserConfig, defineConfig, mergeConfig } from 'vite';
+import type { ConfigEnv, UserConfig } from 'vite';
+import { defineConfig, mergeConfig } from 'vite';
 import { getBuildConfig, external, pluginHotRestart } from './vite.base.config';
 
 // https://vitejs.dev/config
 export default defineConfig((env) => {
-  const { forgeConfigSelf } = env as ForgeConfigEnv<'build'>;
+  const forgeEnv = env as ConfigEnv<'build'>;
+  const { forgeConfigSelf } = forgeEnv;
   const config: UserConfig = {
     build: {
       rollupOptions: {
@@ -23,5 +25,5 @@ export default defineConfig((env) => {
     plugins: [pluginHotRestart('reload')],
   };
 
-  return mergeConfig(getBuildConfig(env as any), config);
+  return mergeConfig(getBuildConfig(forgeEnv), config);
 });
diff --git a/packages/template/vite-typescript/tmpl/vite.renderer.config.ts b/packages/template/vite-typescript/tmpl/vite.renderer.config.ts
@@ -1,9 +1,11 @@
-import { type UserConfig, defineConfig } from 'vite';
+import type { ConfigEnv, UserConfig } from 'vite';
+import { defineConfig } from 'vite';
 import { pluginExposeRenderer } from './vite.base.config';
 
 // https://vitejs.dev/config
 export default defineConfig((env) => {
-  const { root, mode, forgeConfigSelf } = env as ForgeConfigEnv<'renderer'>;
+  const forgeEnv = env as ConfigEnv<'renderer'>;
+  const { root, mode, forgeConfigSelf } = forgeEnv;
   const name = forgeConfigSelf.name ?? '';
 
   return {

diff --git a/packages/template/vite/src/ViteTemplate.ts b/packages/template/vite/src/ViteTemplate.ts
@@ -15,6 +15,8 @@ class ViteTemplate extends BaseTemplate {
         title: 'Setting up Forge configuration',
         task: async () => {
           await this.copyTemplateFile(directory, 'forge.config.js');
+          await this.copyTemplateFile(directory, 'forge.env.d.txt');
+          await fs.rename(path.join(directory, 'forge.env.d.txt'), path.join(directory, 'forge.env.d.ts'));
         },
       },
       {

diff --git a/packages/template/vite/test/ViteTemplate_spec.ts b/packages/template/vite/test/ViteTemplate_spec.ts
@@ -24,6 +24,7 @@ describe('ViteTemplate', () => {
   context('template files are copied to project', () => {
     const expectedFiles = [
       'package.json',
+      'forge.env.d.ts',
       'forge.config.js',
       'vite.base.config.mjs',
       'vite.main.config.mjs',

diff --git a/packages/template/vite/tmpl/forge.env.d.txt b/packages/template/vite/tmpl/forge.env.d.txt
@@ -0,0 +1,31 @@
+export {}; // Make this a module
+
+declare global {
+  // This allows TypeScript to pick up the magic constants that's auto-generated by Forge's Vite
+  // plugin that tells the Electron app where to look for the Vite-bundled app code (depending on
+  // whether you're running in development or production).
+  const MAIN_WINDOW_VITE_DEV_SERVER_URL: string;
+  const MAIN_WINDOW_VITE_NAME: string;
+
+  namespace NodeJS {
+    interface Process {
+      // Used for hot reload after preload scripts.
+      viteDevServers: Record<string, import('vite').ViteDevServer>;
+    }
+  }
+
+  type VitePluginConfig = ConstructorParameters<typeof import('@electron-forge/plugin-vite').VitePlugin>[0];
+
+  interface VitePluginRuntimeKeys {
+    VITE_DEV_SERVER_URL: `${string}_VITE_DEV_SERVER_URL`;
+    VITE_NAME: `${string}_VITE_NAME`;
+  }
+}
+
+declare module 'vite' {
+  interface ConfigEnv<K extends keyof VitePluginConfig = keyof VitePluginConfig> {
+    root: string;
+    forgeConfig: VitePluginConfig;
+    forgeConfigSelf: VitePluginConfig[K][number];
+  }
+}
diff --git a/packages/template/vite/tmpl/vite.base.config.mjs b/packages/template/vite/tmpl/vite.base.config.mjs
@@ -8,7 +8,7 @@ export const builtins = [
 
 export const external = [...builtins, ...Object.keys(pkg.dependencies || {})];
 
-/** @type {(env: import('vite').ConfigEnv & { root: string; }) => import('vite').UserConfig} */
+/** @type {(env: import('vite').ConfigEnv<'build'>) => import('vite').UserConfig} */
 export const getBuildConfig = (env) => {
   const { root, mode, command } = env;
 
@@ -27,12 +27,14 @@ export const getBuildConfig = (env) => {
   };
 };
 
-/** @type {(names: string[]) => { [name: string]: { VITE_DEV_SERVER_URL: `${string}_VITE_DEV_SERVER_URL`; VITE_NAME: `${string}_VITE_NAME`; } }} */
+/** @type {(names: string[]) => { [name: string]: VitePluginRuntimeKeys } }} */
 export const getDefineKeys = (names) => {
+  /** @type {{ [name: string]: VitePluginRuntimeKeys }} */
   const define = {};
 
   return names.reduce((acc, name) => {
     const NAME = name.toUpperCase();
+    /** @type {VitePluginRuntimeKeys} */
     const keys = {
       VITE_DEV_SERVER_URL: `${NAME}_VITE_DEV_SERVER_URL`,
       VITE_NAME: `${NAME}_VITE_NAME`,
@@ -42,7 +44,7 @@ export const getDefineKeys = (names) => {
   }, define);
 };
 
-/** @type {(env: Record<string, any>) => Record<string, any>} */
+/** @type {(env: import('vite').ConfigEnv<'build'>) => Record<string, any>} */
 export const getBuildDefine = (env) => {
   const { command, forgeConfig } = env;
   const names = forgeConfig.renderer

diff --git a/packages/template/vite/tmpl/vite.main.config.mjs b/packages/template/vite/tmpl/vite.main.config.mjs
@@ -8,8 +8,10 @@ import {
 
 // https://vitejs.dev/config
 export default defineConfig((env) => {
-  const { forgeConfigSelf } = env;
-  const define = getBuildDefine(env);
+  /** @type {import('vite').ConfigEnv<'build'>} */
+  const forgeEnv = env;
+  const { forgeConfigSelf } = forgeEnv;
+  const define = getBuildDefine(forgeEnv);
   const config = {
     build: {
       lib: {
@@ -29,5 +31,5 @@ export default defineConfig((env) => {
     },
   };
 
-  return mergeConfig(getBuildConfig(env), config);
+  return mergeConfig(getBuildConfig(forgeEnv), config);
 });
diff --git a/packages/template/vite/tmpl/vite.preload.config.mjs b/packages/template/vite/tmpl/vite.preload.config.mjs
@@ -7,7 +7,9 @@ import {
 
 // https://vitejs.dev/config
 export default defineConfig((env) => {
-  const { forgeConfigSelf } = env;
+  /** @type {import('vite').ConfigEnv<'build'>} */
+  const forgeEnv = env;
+  const { forgeConfigSelf } = forgeEnv;
   /** @type {import('vite').UserConfig} */
   const config = {
     build: {
@@ -28,5 +30,5 @@ export default defineConfig((env) => {
     plugins: [pluginHotRestart('reload')],
   };
 
-  return mergeConfig(getBuildConfig(env), config);
+  return mergeConfig(getBuildConfig(forgeEnv), config);
 });
diff --git a/packages/template/vite/tmpl/vite.renderer.config.mjs b/packages/template/vite/tmpl/vite.renderer.config.mjs
@@ -3,7 +3,9 @@ import { pluginExposeRenderer } from './vite.base.config.mjs';
 
 // https://vitejs.dev/config
 export default defineConfig((env) => {
-  const { root, mode, forgeConfigSelf } = env;
+  /** @type {import('vite').ConfigEnv<'renderer'>} */
+  const forgeEnv = env;
+  const { root, mode, forgeConfigSelf } = forgeEnv;
   const name = forgeConfigSelf.name ?? '';
 
   /** @type {import('vite').UserConfig} */