electron-forge-plugin-vite

Since Electron Forge v6.1.1 started supporting Vite.

├─┬ plugin
│ │
│ ├─┬ src
│ │ ├── util/
│ │ └── VitePlugin.ts  `electron-forge-plugin-vite`
│ │
│ ├─┬ src-migration
│ │ └── index.ts       `electron-forge-plugin-vite/migration`
│ │
│ └─┬ src-plugin
│   └── index.ts       `electron-forge-plugin-vite/plugin`
│

---

electron-forge-plugin-vite

For test electron-forge Vite template.

🚨 This is just a test version of the official plugin @electron-forge/plugin-vite and is only intended as a test for the development phase.

Quick Setup

# npm
npm i -g electron-forge-template-vite-typescript
npm create electron-app my-vite-app --template=vite-typescript

# yarn
yarn global add electron-forge-template-vite-typescript
yarn create electron-app my-vite-app --template=vite-typescript

🔥 Hot restart

electron-forge-plugin-vite@0.4.0+

// vite.main.config.mjs    - For Electron Main
// vite.preload.config.mjs - For Preload Scripts

import { defineConfig } from 'vite';
import { restart } from 'electron-forge-plugin-vite/plugin';

// https://vitejs.dev/config
export default defineConfig({
  plugins: [restart()],
});

Migration

Migrate to v7.3.0+ version.

Why not the Vite plugin? Because dynamically inserting new plugins into the vite.config.ts in the plugin does not work!

---

vite.main.config.ts

  import { defineConfig } from 'vite';
+ import { forgeViteConfig } from 'electron-forge-plugin-vite/migration';

  // https://vitejs.dev/config
- export default defineConfig({
+ export default defineConfig(forgeViteConfig.main({
    resolve: {
      // Some libs that can run in both Web and Node.js, such as `axios`, we need to tell Vite to build them in Node.js.
      browserField: false,
      conditions: ['node'],
      mainFields: ['module', 'jsnext:main', 'jsnext'],
    },
- });
+ }));

vite.renderer.config.ts

  import { defineConfig } from 'vite';
+ import { forgeViteConfig } from 'electron-forge-plugin-vite/migration';

  // https://vitejs.dev/config
- export default defineConfig({});
+ export default defineConfig(forgeViteConfig.renderer({}));

---

vite.preload.config.ts

  import { defineConfig } from 'vite';
+ import { forgeViteConfig } from 'electron-forge-plugin-vite/migration';

  // https://vitejs.dev/config
- export default defineConfig({});
+ export default defineConfig(forgeViteConfig.preload({}));