创建 BasicElectronApp.md
@@ -0,0 +1,28 @@
|
|||||||
|
# 基本 Electron 结构
|
||||||
|
|
||||||
|
如果你也想整一个 Electron 应用,可以看看这里。
|
||||||
|
|
||||||
|
当然,光看这里是不够的,[Electron 自己的文档](https://electronjs.org/) 你也得看。
|
||||||
|
|
||||||
|
## 创建方式
|
||||||
|
|
||||||
|
芒果工具箱是使用 [Electron Forge](https://www.electronforge.io/) 创建的。大概来说,项目的起点是这一行命令:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npx create-electron-app@latest my-app --template=vite-typescript
|
||||||
|
```
|
||||||
|
|
||||||
|
在此基础上,再安装了 [Vue](https://cn.vuejs.org/) 和 [NaiveUI](https://www.naiveui.com/zh-CN/light) 作为前端框架。
|
||||||
|
|
||||||
|
你看,起步其实并不难。
|
||||||
|
|
||||||
|
## 项目结构
|
||||||
|
|
||||||
|
`src` 是源代码目录,其中包含四个子目录,其中三个是 Electron Forge 作为模板创建的。
|
||||||
|
|
||||||
|
* `main` 是 Electron 后端的源代码目录,运行在 Nodejs 环境中;
|
||||||
|
* `preload` 是一些预加载脚本,用来在后端 Nodejs 运行的代码与前端 BrowserWindow 中运行的代码间架起桥梁;
|
||||||
|
* `renderer` 是在前端、BrowserWindow 中运行的代码,环境是现代浏览器(Chromium);
|
||||||
|
* `my-type` 是我设计的前后端共享的类型和数据的目录。
|
||||||
|
|
||||||
|
这就是基本结构了,现在你应该了解哪边的代码都在哪里了。
|
||||||
Reference in New Issue
Block a user