mirror of
https://github.com/electron-vite/electron-vite-vue
synced 2025-01-31 20:16:36 +08:00
76 lines
2.4 KiB
Markdown
76 lines
2.4 KiB
Markdown
# electron-vite-vue
|
|
|
|
🥳 Really simple `Electron` + `Vue` + `Vite` boilerplate.
|
|
|
|
[](https://github.com/vitejs/awesome-vite)
|
|
[](https://app.netlify.com/sites/electron-vite/deploys)
|
|
|
|
|
|
|
|
|
|
## Features
|
|
|
|
📦 Out of the box
|
|
🎯 Based on the official [vue-ts](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-vue-ts) template, 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
|
|
```
|
|
|
|
<!-- [](https://asciinema.org/a/483731) -->
|
|
|
|
|
|
|
|
## Debug
|
|
|
|
|
|
|
|
## Directory
|
|
|
|
```diff
|
|
+ ├─┬ electron
|
|
+ │ ├─┬ main
|
|
+ │ │ └── index.ts entry of Electron-main
|
|
+ │ └─┬ preload
|
|
+ │ └── index.ts entry of Electron-preload
|
|
├─┬ src
|
|
│ └── main.ts entry of Electron-renderer
|
|
├── index.html
|
|
├── package.json
|
|
└── vite.config.ts
|
|
```
|
|
|
|
## 🚨 `dependencies` vs `devDependencies`
|
|
|
|
**Put Node.js packages in `dependencies`**
|
|
|
|
**e.g.** `electron-store` `sqlite3` `serilaport` `mongodb` ...others
|
|
|
|
**Put Web packages in `devDependencies`**
|
|
|
|
**e.g.** `vue` `vue-router` `vuex` `pinia` `element-plus` `ant-design-vue` `axios` ...others
|
|
|
|
See more 👉 [dependencies vs devDependencies](https://github.com/electron-vite/vite-plugin-electron-renderer#dependencies-vs-devdependencies)
|
|
|
|
## 🚨 ESM packages
|
|
|
|
**e.g.** `node-fetch` `execa` `got` ...others
|
|
|
|
1. `npm i vite-plugin-esmodule -D`
|
|
2. Configure in vite.config.ts
|
|
|
|
```ts
|
|
import esmodule from 'vite-plugin-esmodule'
|
|
export default {
|
|
plugins: [
|
|
esmodule(['got', 'execa', 'node-fetch']),
|
|
],
|
|
}
|
|
```
|