width: login_width,height: register_height,show:false,transparent:true,autoHideMenuBar:true,titleBarStyle:'hidden',resizable:false,frame:true,mediaAccess:true,webPreferences: {preload:join(__dirname,'../preload/index.js'),webSecurity:
vue(), electron({//主进程入口文件entry: './src-electron/main.js'}) ],/*开发服务器选项*/server: {//端口port: 3000, } }) 5.新建一个src-electron文件用来写electron的代码,在它下面创建一个main.js文件 用来写主进程代码 //src-electron/main.jsconst { app, BrowserWindow, Menu } = require(...
通常,这意味着你应该将打包后的 Vue 文件(位于你的dist或dist-electron目录中)作为本地资源加载。 首先,确保你的 Vue 应用程序已经正确地打包到了dist或dist-electron目录中。然后,在 Electron 的主进程文件(例如main.js)中,使用mainWindow.loadURL()加载本地 Vue 应用的入口文件,例如mainWindow.loadURL('file:/...
原理就是先获取vue.config.js中的打包配置,如果重新配置了路径directories.output就动态去清空 const rm = require('rimraf'); const path = require('path'); const pluginOptions = require('../../vue.config').pluginOptions; let directories = pluginOptions.electronBuilder.builderOptions.directories; let...
第一步:全局安装vue脚手架(如果已安装,就不必进行这一步了) 第二步:通过vue脚手架,创建一个vue项目 第三步:进入创建好的vue项目文件,安装electron 第四步:配置package.json文件和main.js文件 第五步:加载vue项目 第六步:运行electron命令,弹出应用框。
vite5-electron31-admin:原创electron31+vue3 setup+pinia2+element-plus+echarts搭建客户端轻量级后台管理系统。提供4种通用布局模板,支持i18n国际化、动态路由权限,实现了表格、表单、图表、列表、编辑器等常用模块。 electronelectron-buildervitevue3element-pluselectron31-adminvite5+electron31后台electron31桌面端后台...
Electron、Vite和Vue3的结合,为我们提供了一个强大而灵活的解决方案,能够快速开发出美观、功能丰富的跨平台桌面应用。 一、Electron简介 Electron是一个使用Web技术(HTML, CSS, 和JavaScript)来创建跨平台桌面应用程序的框架。它结合了Chromium和Node.js,让开发者能够使用前端技术来编写应用界面,并通过Node.js访问底层...
Electron + vue3 1.Electronjs electron概念:Electron 是一个基于Chromium 和 Node.js实现的桌面应用框架,可以使用 JavaScript, HTML 和 CSS 等 Web 技术构建原生程序,例如vscode、skype、whatsapp等都是基于electronjs框架开发的。electron优点:跨平台,开源免费,社区活跃,一次编写,Windows、Mac、Linux都能运行。
一.vue项目搭建 安装electron 需要搭建vue项目,这里用的vue3项目。 1.安装 下载 node 这里用的16版本 https://nodejs.org/zh-cn/ 2.设置淘宝镜像 npm config set registry https://registry.npm.taobao.org 3.安装 vue-cli npm install -g @vue/cli ...
有时,我们需要在 Electron 应用中集成一个后端服务器来处理复杂的逻辑或与数据库交互。Express 是一个轻量级且灵活的 Node.js 框架,非常适合这种需求。在这篇博客中,我们将探讨如何在 Vite + Vue 3 + Electron 项目中集成 Express。 项目结构 首先,我们需要创建一个基本的 Vite + Vue 3 + Electron 项目结构。