https://github.com/q9887777/electron-vite-vue

https://github.com/q9887777/electron-vite-vue

Last synced: 3 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/q9887777/electron-vite-vue
• Owner: q9887777
• License: mit
• Created: 2022-10-19T03:15:27.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2023-03-01T12:01:10.000Z (over 2 years ago)
• Last Synced: 2025-01-24T14:21:53.157Z (4 months ago)
• Language: TypeScript
• Size: 3.18 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# electron-vite-vue

🥳 Really simple `Electron` + `Vue` + `Vite` boilerplate.

[![awesome-vite](https://awesome.re/mentioned-badge.svg)](https://github.com/vitejs/awesome-vite)

[![Netlify Status](https://api.netlify.com/api/v1/badges/ae3863e3-1aec-4eb1-8f9f-1890af56929d/deploy-status)](https://app.netlify.com/sites/electron-vite/deploys)

[![GitHub license](https://img.shields.io/github/license/caoxiemeihao/electron-vite-vue)](https://github.com/electron-vite/electron-vite-vue/blob/main/LICENSE)

[![GitHub stars](https://img.shields.io/github/stars/caoxiemeihao/electron-vite-vue?color=fa6470)](https://github.com/electron-vite/electron-vite-vue)

[![GitHub forks](https://img.shields.io/github/forks/caoxiemeihao/electron-vite-vue)](https://github.com/electron-vite/electron-vite-vue)

[![GitHub Build](https://github.com/electron-vite/electron-vite-vue/actions/workflows/build.yml/badge.svg)](https://github.com/electron-vite/electron-vite-vue/actions/workflows/build.yml)

## Features

📦 Out of the box  

🎯 Based on the official [template-vue-ts](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-vue-ts), less invasive  

🌱 Extensible, really simple directory structure  

💪 Support using Node.js API in Electron-Renderer  

🔩 Support C/C++ native addons  

🖥 It's easy to implement multiple windows  

## Quick Start

```sh

npm create electron-vite

```

![electron-vite-vue.gif](https://github.com/electron-vite/electron-vite-vue/blob/main/public/electron-vite-vue.gif?raw=true)

## Debug

![electron-vite-react-debug.gif](https://github.com/electron-vite/electron-vite-react/blob/main/public/electron-vite-react-debug.gif?raw=true)

## Directory

```diff

+ ├─┬ electron

+ │ ├─┬ main

+ │ │ └── index.ts    entry of Electron-Main

+ │ └─┬ preload

+ │   └── index.ts    entry of Preload-Scripts

  ├─┬ src

  │ └── main.ts       entry of Electron-Renderer

  ├── index.html

  ├── package.json

  └── vite.config.ts

```

## Be aware

🚨 By default, this template integrates Node.js in the Renderer process. If you don't need it, you just remove the option below. [Because it will modify the default config of Vite](https://github.com/electron-vite/vite-plugin-electron/tree/main/packages/electron-renderer#config-presets-opinionated).

```diff

# vite.config.ts

export default {

  plugins: [

-   // Use Node.js API in the Renderer-process

-   renderer({

-     nodeIntegration: true,

-   }),

  ],

}

```

## FAQ

- [dependencies vs devDependencies](https://github.com/electron-vite/vite-plugin-electron/tree/main/packages/electron-renderer#dependencies-vs-devdependencies)

- [Using C/C++ native addons in Electron-Renderer](https://github.com/electron-vite/vite-plugin-electron/tree/main/packages/electron-renderer#load-nodejs-cc-native-modules)

- [Node.js ESM packages](https://github.com/electron-vite/vite-plugin-electron/tree/main/packages/electron-renderer#nodejs-esm-packages) (e.g. `execa` `node-fetch`)