Electron-vue项目构建
最近项目要做一个桌面应用，因为之前也是没有做过桌面应用，所以写下笔记记录一下问题。希望能帮助到有需要的人。话不多说，直接上干货。
目前做桌面应用被大家考虑的有两个工具，NW.js和Electron。因为分析之后NW.js优点不少，比如可以支持XP；缺点是卡顿，打包比较大等。Electron有很多成熟的项目例如Visual Studio Code、Slack等相较NW.js更稳定，支持多平台包括了桌面端，Web端，移动端。我们最后选择的Electron进行开发。具体对比可参考：Electron和NW.js优缺点对比分析。
需要环境
当然说到vue，node是必不可少的，这两个安装完毕，就可以开始写项目了。
安装步骤
1.安装vue的脚手架
npm install -g vue-cli
2.创建一个electron-vue的项目
vue init simulatedgreg/electron-vue my-project
创建electron-vue项目
这里可能会出现vue : 无法加载文件 C:\Users\xxxx\AppData\Roaming\npm\vue.，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/ go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。 所在位置 行:1 字符: 1 + vue init simulatedgreg/electron-vue my-v
vue init simulatedgreg/electron-vue my-project 报错
解决方案：
1. 打开 powerShell 用管理员身份运行
2.输入命令： set-ExecutionPolicy RemoteSigned
3.输入A
3.进入项目目录
cd my-project
4.安装依赖
npm i
5.启动项目
npm run dev
启动成功
6.项目结构
项目结构
.electron-vue：webpack和electron的一些配置
build:项目打包后的文件
src：里面有两个文件夹
src里的文件
main：electron的主进程文件在里面配置
renderer：是vue的代码文件，按vue的实现方法写就可以
7.打包
electron-vue有内置的打包，执行 npm run build就可以。每次重新打包前，执行一下npm run build:clean 清除之前打包的代码，在执行打包。不报错，就说明打包完成，点击build文件下的.exe文件，看下效果：
打包后运行的项目
希望可以帮助到你，大家一起进步。
