vue-cli3搭配vue-cli-plugin-electron-builder构建桌面端程序

注意：本项目使用的是vue3的脚手架配合vue-cli-plugin-electron-builder插件搭建

第一步：用vue-cli3.0创建一个项目

vue create projectName

当前步骤就是安装vue-cli3.0，一步步按照程序走安装就好。

第二步：安装vue-cli-plugin-electron-builder

vue add vue-cli-plugin-electron-builder

当前步骤安装好后会自动在package.json里生成几行代码如下：

WX20220313-155227@2x.png

第三步：运行项目

npm run electron:serve

1.png

第四步：打包项目

npm run electron:build

打包成功后的文件如下：

3.png

到此一个简单的项目就搭建完成了；当然这只是理想的情况，而且是比较基础和简单的场景。当你在配置或者打包的时候会遇到安装或者打包报错的问题，这些问题需要自己手动解决。后续会逐步补充在使用中遇到的常见的一些问题。