「这是我参与2022首次更文挑战的第1天，活动详情查看:2022首次更文挑战」。
在2年前，第一次接触electron之后便遇到了github大佬的架子，很完美，但是却不知道什么原因，大佬也不再更新架子本体的版本，在经历时间的冲洗，electron的版本也最终到了16，而webapck也发布了第五版，vite也横空出世，而此时，我便萌发了: "不如我来改一改这个架子吧！"所以项目便在两年前开始摸索，一直到现在。
项目本身分为两个分支，master则是追求稳定，electron版本跟随vscode，而nolayout呢，不仅只有一个单页面，而且electron版本是跟随electron官方的稳定版本，其余依赖也是如此。
呦西~ 废话不多说，首先看看它在原来的基础上需要增加哪些功能吧~
- 更新
- 全量更新
- 增量更新
- 国际化（渲染进程）
- 启动动画
项目文件结构预览：
├── .electron-vue # 构建相关
├── build # 项目打包目录
│ └── icon # 图标
├── config # 构建相关
├── dist # 构建临时目录
├─ src # 源码目录
│ ├─ main # 主进程目录
│ │ ├─ config # 主进程配置文件夹
│ │ │ ├─DisableButton.js # 配置全局快捷键禁用
│ │ │ ├─StaticPath.js # 静态路径文件
│ │ │ └─menu.js # 主进程的自定义菜单
│ │ ├─ server # 内置服务端文件夹
│ │ │ ├─index.js # 内置服务端启动
│ │ │ └─server.js # 内置服务端主体
│ │ ├─ services # 主进程文件夹
│ │ │ ├─checkupdate.js # electron-updater更新
│ │ │ ├─downloadFile.js # 下载文件方法
│ │ │ ├─ipcMain.js # ipcMain通讯
│ │ │ └─windowManager.js # 初始出所有窗口
│ │ └─ index.js # 主进程入口
│ ├─ renderer # 渲染进程文件夹
│ │ ├─api # 请求文件夹
│ │ ├─assets # 渲染进程静态资源
│ │ ├─components # 全局公用组件
│ │ ├─icons # 项目所有 svg icons
│ │ ├─layout # 全局 layout
│ │ ├─router # 路由
│ │ ├─store # store管理
│ │ ├─styles # 全局样式
│ │ ├─tools # 全局特定工具
│ │ ├─utils # 全局公共方法
│ │ ├─views # views 所有页面
│ │ ├─App.vue # 全局公共方法
│ │ ├─error.js # 全局公共方法
│ │ ├─main.js # 全局公共方法
│ │ └─permission.js # 全局公共方法
│ │
│ └─ index.ejs # 渲染进程的html模板
├─static # 静态资源
├── .eslintrc.js # eslint 配置项
├── .babelrc # babel-loader 配置
├── postcss.config.js # postcss 配置
├── yarn.lock # yarn包管理器锁文件
└── package.json # package.json
开始之前我们先想一想，大致的软件启动流程是怎么样的？
我绘制了一个简单的流程图如下：
思路上是启动的时候 -> 先启动一个无边框窗口用来展示loading窗口，其中这个窗口你可以也可以通过添加图片或者是其他的方法让它更贴近原生应用的感觉，然后你可以在loading窗口中，去执行数据库的初始化也好，其他的初始化操作也罢，等待执行完成以后 -> 执行整个业务窗口部分这样看起来，不会有一个奇怪的空白窗口，整个过程大概类似adobe pr的启动~
那更新呢？
同样这里也绘制了一个流程图如下：
- 什么是发版更新？
- 就是每次打包以后的可执行文件安装包
- 什么是资源更新
- 如果非要简单理解的话，那就是整个渲染进程的文件，实际上这里也是可以包含主进程代码的。
- 什么是基座代码
- 在electron中，会将package.json文件中dependencies对象内的依赖一同打包进app.asar中，因为有些node文件的二进制依赖，是不可以被打包到js代码里；例如：sqlite3；所以我将这些依赖称之为基座代码。
为何全量更新会在最开始？而不是两个分开检查，因为全量更新中实际上是已经打包了最新的代码，所以默认情况下，其实只需要管全量就好了，而增量部分，只要保证基座代码是最新的，何时更新都可以。
而若要启用资源更新，那就必然是要解包asar，这是没有办法的事情，因为在windows中asar文件在软件运行时，是无法被删除的；所以呢就需要不让他将文件固定成一个文件，然后就可以随意删除并且替换了，在接下来的文章里我就会带来完整的webpack配置和这些设置的详细说明啦~~~
