这篇文章主要是通过对简单的Electron应用程序的开发目录进行介绍，让读者对整个开发视图有初步的了解，能大概知道开发一个Electron程序需要具备哪些模块。
如果对文章的内容有任何疑问或吐槽，请直接在下方评论，大家共同学习和改进
阅读时间：约5min
程序目录结构
Electron应用程序分成三个基础模块：
- 主进程
- 进程间通信
- 渲染进程
对于做纯web开发的新人，可能对多进程开发结构不熟悉。在浏览器中，基于安全策略考虑，web页面通常是在一个沙盒环境中运行的，不被允许去接触原生的资源。然而在Electron中允许页面（渲染进程）调用Node.js的API，所以页面可以与操作系统底层进行交互。
我们知道每个进程都是一个独立运行单位，相互不能直接通信。在Electron中提供两种方法在主进程与渲染进程之间进行通信。
- 使用ipcRenderer和ipcMain模块发送消息
- 使用remote模块进行 RPC 方式的通信
Electron程序目录基础目录结构如下：
app----------------------------应用程序代码目录
├─main.js----------------------程序启动入口，主进程
├─ipc--------------------------进程间通信模块
└─browserWindows---------------窗口管理，渲染进程
└─src----------------------窗口业务模块
├─窗口A----------------窗口A
└─窗口B----------------窗口B
主进程
主进程就像是应用程序的管家，负责管理整个应用程序的生命周期，所有的渲染进程的创建。
渲染进程
渲染进程窗口实例通过Electron提供的BrowserWindow对象创建，每一个实例都是一个独立的进程，它只关心它所在运行的web页面。实例被销毁后，相应的渲染进程也会被销毁。且主进程被销毁后，渲染进程全部也会被销毁。在chrome浏览器的默认策略下，每一个tab都是独立的进程，Electron也正是利用了这一策略。
主进程模块目录
Electron主进程负责管理整个程序系统模块的启动，以及整个应用生命周期的管理，创建管理窗口实例（渲染进程）。对于Electron程序，有几大基础系统模块，根据相关功能模块划分，结构如下图所示。
主进程目录结构：
app----------------------------应用程序代码目录
├─main.js----------------------程序启动入口，主进程
├─common-----------------------通用模块
├─log--------------------------日志模块
├─config-----------------------配置模块
├─ipc--------------------------进程间模块
├─appNetwork-------------------应用通信模块
└─browserWindows---------------窗口管理，渲染进程
下面简单的讲解下各个模块的职责
1、通用模块
通用模块是系统通用工具、插件。例如封装对系统注册表SDK、封装本地DLL调用模块、封装HTTP模块等等。
2、日志模块
任何系统都不能缺少日志模块，负责程序错误收集，方便定位、调试问题。
3、配置模块
配置模块负责管理整个程序通用参数配置。这里的配置不一定是本地配置，也可以是远程的配置中心。
4、进程通信模块
Electron提供了进程通信方式ipc、remote，进程通信模块负责管理渲染进程间通信事件枚举。当你需要从主进程main.js向其中一个窗口发送消息数据的时候，需要注册一个双方约定的事件，这个模块就是专门负责管理这些事件的。
5、应用间通信模块
客户端应用，涉及到应用间通信的场景很多。所以这里补充一个应用间通信的模块。
6、窗口管理模块
主进程最基本的功能就是创建窗口实例，对于多窗口应用，需要有窗口管理模块，专门负责管理应用窗口实例。
渲染进程模块目录
渲染进程更像是web多页应用程序，负责管理它里面的web页面运。每一个窗口对应一个独立的页面，彼此之间可以通过localstorage、indexDB等本地数据存在接口共享数据，共同完成整个应用的运作。根据功能抽离通用模块，公共组件、共享数据、静态资源。整体结构如下图所示：
渲染进程目录结构：
browserWindows-----------------窗口管理，渲染进程
├─components---------------通用组件模块
├─store--------------------数据共享模块
├─statics------------------静态资源模块
└─src----------------------窗口业务模块
├─窗口A----------------窗口
└─窗口B----------------窗口
1、通用组件模块
通用组件模块负责管理全局通用组件，各个窗口之间通用的业务组件。
2、数据共享模块
窗口之间存在共享数据，统一由数据共享模块管理。对于窗口之间共享数据，推荐采用localstorage、indexDB进行存储。
3、静态资源模块
静态资源模块负责管理程序使用的媒体资源、字体等等。
4、窗口业务模块
窗口对应的web页面，web页面执行的js脚本，统一由窗口业务模块管理。
总结
综上所述，整个应用程序结构如下图所示：
目录结构如下：
app----------------------------应用程序代码目录
├─main.js----------------------程序启动入口，主进程
├─common-----------------------通用模块
├─log--------------------------日志模块
├─config-----------------------配置模块
├─ipc--------------------------进程间模块
├─appNetwork-------------------应用通信模块
└─browserWindows---------------窗口管理，渲染进程
├─components---------------通用组件模块
├─store--------------------数据共享模块
├─statics------------------静态资源模块
└─src----------------------窗口业务模块
├─窗口A----------------窗口
└─窗口B----------------窗口
本文对Electron最基本的目录结构做了一个简单的介绍，想必读到这大家脑中已经有了一个概念了。在下一篇文章中，会花长篇幅讲文章中提到的主进程和渲染进程，以及它们之间的通信。
