4. 文件树

在开发过程中

注意 : 某些文件或文件夹可能会根据在 vue-cli 脚手架中所选设置的不同而有所不同。

my-project
├─ .electron-vue
│  └─ <build/development>.js files
├─ build
│  └─ icons/
├─ dist
│  ├─ electron/
│  └─ web/
├─ node_modules/
├─ src
│  ├─ main
│  │  ├─ index.dev.js
│  │  └─ index.js
│  ├─ renderer
│  │  ├─ components/
│  │  ├─ router/
│  │  ├─ store/
│  │  ├─ App.vue
│  │  └─ main.js
│  └─ index.ejs
├─ static/
├─ test
│  ├─ e2e
│  │  ├─ specs/
│  │  ├─ index.js
│  │  └─ utils.js
│  ├─ unit
│  │  ├─ specs/
│  │  ├─ index.js
│  │  └─ karma.config.js
│  └─ .eslintrc
├─ .babelrc
├─ .eslintignore
├─ .eslintrc.js
├─ .gitignore
├─ package.json
└─ README.md

产品构建

app.asar
├─ dist
│  └─ electron
│     ├─ static/
│     ├─ index.html
│     ├─ main.js
│     └─ renderer.js
├─ node_modules/
└─ package.json

可以说,几乎所有的东西都在最终的产品构建中被删除。在分发 electron 应用程序时,这几乎是强制性的,因为你不希望用户下载拥有庞大文件的臃肿的软件。

下一节:由于 Electron 使用 Chromium 显示网页,那么,Chromium 的多进程架构也被使用。Electron 中的每个网页都在自己的进程中运行,称为渲染器进程 (renderer process)。