使用elector把vue打包exe
提供两种方法 原理是相同的 第一种比较简单的:
方法一
-
新建文件夹 在当前文件夹中打开cmd
-
npm init
初始化项目,会生成一个package.json文件
-
npm install electron --save-dev
安装electron -
npm install electron-packager --save-dev
-
在vue项目中执行
npm run build
打包生成dist文件夹 将该文件夹复制到上面的文件夹中
-
打开package.json文件 原文件应该是:
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
添加一行:
electron-packager <应用目录> <应用名称> <打包平台> --out <输出目录> <架构> <应用版本>
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"packager": "electron-packager . TDS --platform=win32 --arch=x64 --icon=favicon.ico --out=./out --asar --app-version=0.0.1 --overwrite to force"
},
- 执行
npm run packager
即可
方法二
方法二与方法一基本类似 只不过方法二是利用官方文档的demo
- 新建文件夹 在当前文件夹克隆项目地址
git clone https://github.com/electron/electron-quick-start
- cd 进入 electron-quick-start 文件夹 打开cmd
npm install
添加依赖 - 将之前打包好的dist放入当前文件夹
- 这里要多一步修改 main.js 文件
mainWindow.loadFile('index.html')
改为
mainWindow.loadFile('dist/index.html')
剩下的步骤就和方法一的 4 6 7一样操作即可