https://github.com/archergu/fast-vite-electron

Vite + Electron with esbuild, so fast! ⚡
https://github.com/archergu/fast-vite-electron

electron electron-vite electron-vue esbuild template vite vue

Last synced: 3 days ago
JSON representation

Vite + Electron with esbuild, so fast! ⚡

• Host: GitHub
• URL: https://github.com/archergu/fast-vite-electron
• Owner: ArcherGu
• License: mit
• Created: 2021-07-09T05:48:24.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2024-10-19T00:48:44.000Z (3 months ago)
• Last Synced: 2024-10-19T21:26:03.158Z (3 months ago)
• Topics: electron, electron-vite, electron-vue, esbuild, template, vite, vue
• Language: TypeScript
• Homepage:
• Size: 2.85 MB
• Stars: 186
• Watchers: 2
• Forks: 19
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


    



# ⚡Vite + Electron & Doubleshot Template

This template is used to build vite + electron projects. Build with [Doubleshot](https://github.com/Doubleshotjs/doubleshot), crazy fast!

🎉 [Doubleshot](https://github.com/Doubleshotjs/doubleshot) is a whole new set of tools to help you quickly build and start a node backend or electron main process.

This template is based on a small framework [einf](https://github.com/ArcherGu/einf) that I wrote myself, which may not be complete, if you want to apply to production, you can use the templates with integrated nest.js:

- [Vue.js template](https://github.com/ArcherGu/fast-vite-nestjs-electron)

- [React template](https://github.com/ArcherGu/vite-react-nestjs-electron)

- [Svelte.js template](https://github.com/ArcherGu/vite-svelte-nestjs-electron)

## Features

- 🔨 [vite-plugin-doubleshot](https://github.com/archergu/doubleshot/tree/main/packages/plugin-vite#readme) to run/build electron main process.

  


- 😎 Controllers/Services ipc communication, powered by Typescript [decorators](https://www.typescriptlang.org/docs/handbook/decorators.html).

  


- ⚡ Rendering process is powered by [Vite](https://vite.io/).

  


- ⏩ Quick start and build, powered by [tsup](https://tsup.egoist.sh/) and [electron-builder](https://www.electron.build/) integrated in [@doubleshot/builder](https://github.com/Doubleshotjs/doubleshot/tree/main/packages/builder)

## Motivation

In the past, I've been building desktop clients with [vue](https://v3.vuejs.org/) + [vue-cli-plugin-electron-builder](https://github.com/nklayman/vue-cli-plugin-electron-builder), and they work very well. But as the project volume grows, webpack-based build patterns become slower and slower.

The advent of [vite](https://vitejs.dev/) and [esbuild](https://esbuild.github.io/) greatly improved the development experience and made me feel lightning fast ⚡.

It took me a little time to extract this template and thank you for using it.

## How to use

- Click the [Use this template](https://github.com/ArcherGu/fast-vite-electron/generate) button (you must be logged in) or just clone this repo.

- In the project folder:

  ```bash

  # install dependencies

  yarn # npm install

  # run in developer mode

  yarn dev # npm run dev

  # build

  yarn build # npm run build

  ```

## Note for PNPM

In order to use with `pnpm`, you'll need to adjust your `.npmrc` to use any one the following approaches in order for your dependencies to be bundled correctly (ref: [#6389](https://github.com/electron-userland/electron-builder/issues/6289#issuecomment-1042620422)):

```

node-linker=hoisted

```

```

public-hoist-pattern=*

```

```

shamefully-hoist=true

```

## Relative

My blog post:

- [极速 DX Vite + Electron + esbuild](https://archergu.me/posts/vite-electron-esbuild)

- [用装饰器给 Electron 提供一个基础 API 框架](https://archergu.me/posts/electron-decorators)