vue项目变桌面应用。

公司提出来一个需求，要把vue项目变成桌面应用，面对这样的需求，我也是小白一个，看啦100多帖子，没找到一个是可以按照步骤直接成功的。
今天自己总结啦一个线上版本的。

第一步—拉官方代码，安装依赖。

1、git clone https://github.com/electron/electron-quick-start
2、打开拉下来的代码
3、npm install

第二步–找到你们项目部署在nginx的地址

第三步–修改官方代码下main.js中的加载文件的路径

mainWindow.loadFile('index.html') // 默认的请求路径修改一下
mainWindow.loadURL('http://+nginx中的地址')//修改后的
mainWindow.loadURL('http://192.168.200.2')//修改后的例子

修改好之后

npm start  //启动命令

启动一下看一下项目是否可以启动。

第五步–打包
在package.json文件中配置打包命令找到scripts直接覆盖

  "scripts": {
    "start": "electron .",
    "build:mac": "electron-packager . 应用名字 vue-objccn --platform=darwin --out ./dist/$npm_package_version --overwrite --icon=logo.icns --ignore=node_modules/* --ignore=.git --ignore=dist/$npm_package_version",
    "build:win": " electron-packager . 应用名字  vue-objccn --platform=win32 --out ./dist/$npm_package_version --overwrite  --ignore=node_modules/* --ignore=.git --ignore=dist/$npm_package_version"
  },

两个命令一个苹果系统的，一个window系统的。还需要其他的去搜索一下就可以拉。不过有个巨坑。打包必须要匹配系统，对应系统只能打相对应系统的包（苹果系统只能打苹果的包，打window的会报错），如果想要跨系统，还需要下载其他的插件。目前我还没有找到好用的。。。。
打包命令

npm run build:mac //mac版本
npm run build:win //window版本