前言
最近在忙别的事情，一直没来得及更新博客，今天就写一个关于桌面应用的吧。
这个东西是我一直想做的，学了好长时间的web了，面对各种网站，心里总有一种说不上来的冲动。
对桌面应用一直感兴趣，就感觉这东西好神奇，怎么就可以变成一个安装包安装了？怎么就可直接在桌面打开了？怎么就可以有和网站一样的功能了？这一切要从一个电子说起！
开搞
先搞一个vue项目，就普普通通的
vue create 项目名就行。不会建的参考我的另一篇博客vue创建项目，如果还没有装环境的，先把环境装了吧。-
切换到项目目录下，用
vue add electron-builder去装一个electron打包的工具，刚开始可能会报错，这是因为这个网站在外国，必须科学上网（都懂得）。安装完之后是这样的
success -
运行
npm run electron:serve
success -
打包
npm run electron:build，有时候会报错，就像这样（第一次build的时候要有耐心，因为要连外网，连接超时很正常，多试几次）
error
这时就再来一次
success
打包成功
还有的会出现node版本出现问题或者是某一个模块出现缺失，这种情况就要重装node了，用最新版的就行!(两个大哥亲测 node 12总出bug,就升了16，就可以了)
- 安装，点击EXE就能安装了，默认路径是
C:\Users\Administrator\AppData\Local\Programs\项目名
- 这时候可以改安装路径，在项目下建一个和
package.json同级的vue.config.js,里面写这些东西
module.exports = {
pluginOptions: {
electronBuilder: {
// 渲染进程也可以获取原生node包
nodeIntegration: true,
// 打包配置
builderOptions: {
nsis: {
// 一键安装，如果设为true，nsis设置就无意义请直接删除 nsis 配置
oneClick: false,
// true全用户安装，false安装到当前用户
perMachine: true,
// 允许修改安装目录
allowToChangeInstallationDirectory: true,
// 创建桌面图标
createDesktopShortcut: true,
// 创建开始菜单图标
createStartMenuShortcut: true,
// 快捷方式的名称,默认为应用程序名称
// shortcutName: 'xx',
}
}
}
}
};
-
再次打包
success
success
