vue打包成linux可执行程序（windows、mac可执行程序）

处理打包后空白问题

在项目完成后，先处理程序打包后的空白问题：
分两个处理方式（vue-cli2和vue-cli3）

1. vue-cli2：首先找到config/index.js文件，将assetPublicPath的路径改为“./”即可
2. vue-cli3：因为vue-cli3简洁了许多，没有了配置文件，所以需要自己创建，只能在项目的根目录下创建，并且文件的名字只能是vue.config.js，然后在这个文件里面加上下面的代码即可

module.exports = { assetsDir: 'static', parallel: false, publicPath: './',}

 

第一次打包

执行npm run build打包生成dist文件夹

npm run build

 

第二次打包

新建自定义名称文件夹（此处使用app命名），将vue项目打包后的dist修改为自己的项目名（房子后续再次打包后文件夹冲突）后放入app目录中

在app目录中新建package.json文件，package.json中内容如下：

PS：对象的main需改为index.html所在路径，此处在index.html在test文件夹中，所以为test/index.html

 其中如果是要打包成windows，则将对象的dist的linux-x86和linux-x64修改为win-x86和win-x64，如果不需要32为程序，则直接把linux-x86删掉即可

{
"name": "deskapp",
"version": "1.0.0",
"description": "",
 "main": "test/index.html",  
"window": {
"title": "桌面应用",
"icon": "",
"width": 1366,
"height": 768,
"toolbar": false,
"frame": true,
"resizable": true,
"position": "center",
"transparent": false,
"show": true
  },
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dist": "build --tasks linux-x86,linux-x64 --mirror https://npm.taobao.org/mirrors/nwjs/ .",
"start": "run --x86 --mirror https://npm.taobao.org/mirrors/nwjs/ ."
  },
"author": "",
"license": "ISC",
"devDependencies": {
"nwjs-builder-phoenix": "^1.15.0"
  },
"build": {
"nwVersion": "0.27.5"
  }
}

再次安装依赖并打包

 npm install //安装依赖
 
npm run dist //打包

 此时生成dist文件夹

进入dist文件夹，x64为64位程序，x86为32位程序

在linux上使用

将需要的程序其打包拉至linux，此处拉去x64的程序

 

 进入目录中进行赋权限：

chmod 777 deskapp

安装libgconf-2-4，防止报error while loading shared libraries: libgconf-2.so. 4: cannot open shared object file: No such file or directory

sudo apt-get install libgconf-2-4

 运行程序

./deskapp