零、前言

之前看了看electron-vue，感觉还是存在一些问题的，比如electon的版本特别特别低，不能忍受。且如果你是用vue搭建的项目，最后希望能够打包成桌面端，其实很简单。

一、基本步骤

（1）创建vue项目、并进行开发

vue create vueDemo

（2）突然一天我想打包成桌面程序了

// 进入项目目录 cd vueDemo // 添加electron相关库 vue add electron-builder

 这时，他也会自动下载electron。

问题处理：如果最后报错说没有下载成功，那么删掉有问题的模块，使用cnpm进行下载。

cnpm install

二、运行

这里面有几行是执行了vue add electron-builder自动添加进来的。

运行vue的web端：

npm run serve

结果：

 

我这把vue的首页换掉了，所以是这样子：

 打包vue的web端：

文件列表：

 

运行electron搞的cs端：

npm run electon：serve

 

打包electron搞得exe：需要科学上网哦

npm run electron：build 

文件列表：

 

 四、结束

简单记录了下现有vue项目结合electon制作成cs客户端的方法，不会影响到vue的web端的相关执行，后续研究在此基础上结合electron进行开发。