electron-vue-windows,Electron+Vue
这篇文章主要介绍了真空电子制作桌面应用，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
1.vue打包
这里使用某视频剪辑软件原生打包命令，对某视频剪辑软件项目进行打包
新公共管理运行构建
2.配置 Electron
使用电子制作桌面应用需要两个配置文件
1 .包。数据
创建一个package.json文件，将以下代码放入
{
名称:演示,//项目名称
产品名称:演示，
作者: 作者，
版本: 1.0.4 ,
main: main.js ，
描述: 项目描述，
脚本:{
开始:电子, //启动电子项目
打包:电子生成器-目录，
距离:电子生成器，
安装后:电子生成器安装-应用程序-deps，
打包员：电子打包员。我的客户-双赢./my client-arch=x64-app-version=0。0 .1-电子版=2。0 .0 //将项目打包为可执行程序的扩展名文件
},
建立:{
电子版本: 2.0.18 ,
win: {
requestedExecutionLevel : highestAvailable ，
目标:[
{
目标： nsis ，
arch: [
x64
]
}
]
},
appId“:”演示，
artifactName :演示-$ {版本}-${arch} .${ext} ，
nsis :
artifactName :演示-$ {版本}-${arch} .${ext}
}
},
依赖项:{
"核心-js":^2.4.1，
"电子更新者":^2.22.1
},
devDependencies: {
"电子包装工":^12.1.0,
"电子建造者":^20.19.2
}
}
2 .米安网
创建主页。射流研究…将以下代码放入
【注】赢。网页内容。opendevtools()；这句代码的意思是开启调试窗口，生成可执行程序的扩展名文件时需要注释掉
onst {app，BrowserWindow}=require(电子);//引入电子
让赢；
const path=require(path )
让windowConfig={
宽度：800,
身高：600,
web首选项：{ preload:path。resolve(_ _ dirname， electron-preload.js)}
};//窗口配置程序运行窗口的大小
函数createWindow(){
win=新浏览器窗口(窗口配置)；//创建一个窗口
赢了。loadurl(` file://$ { _ _ dirname }/index。html `)；//在窗口内要展示的内容index.html就是打包生成的index.html
赢了。网页内容。opendevtools()；//开启调试工具
win.on(close ，()={
//回收浏览器窗口对象
win=null
});
win.on(resize ，()={
赢了。重载()；
})
}
app.on(就绪，创建窗口)；
app.on(loaded ，()={
console.log(aaa )
});
app.on(窗口-全部关闭,()={
app。quit()；
});
app.on(激活,()={
if(win==null){
创建窗口()；
}
});
const { ipcMain }=要求(电子)
ipcMain.on(ping ，function(even，arg){
console.log(参数)
even.returnValue=pong
})
3.将package.json文件和主页。射流研究…文件放入到某视频剪辑软件打包完成的距离目录下
4.在距离目录下打开结节命令窗口，执行新公共管理安装或cnpm安装下载依赖
新公共管理安装
5.依赖下载成功后执行新公共管理开始，启动该项目，并查看项目是否运行成功
新公共管理开始
运行成功后的结果：
6.如果运行后没有发现bug，则执行新公共管理运行打包程序，将项目制作成可执行程序的扩展名文件，制作成功后，会在当前目录下生成桌面应用的安装包
新公共管理运行打包程序
打包成功后的文件夹
点击该可执行程序的扩展名文件就可以直接打开应用了
到此这篇关于真空电子制作桌面应用的文章就介绍到这了，更多相关真空电子桌面应用内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。