cnpm create electron-vite cnpm i 或 cnpm create @quick-start/electron@latest 打包electron项目 npm run build 或通过以下指令来打包对应的平台包 如果卡在download提示github的网络问题导致打包失败,则自己根据报错提示链接先下载对应的包,再手动放到对应的目录即可,以下是各平台对应的目录: Linux: $XDG_CACHE_HOM...
vite.electron.dev.ts // 导入需要使用的类型和库import type { Plugin } from 'vite'import type { AddressInfo } from 'net'import { spawn } from 'child_process'import fs from 'fs'// 导出Vite插件函数export const viteElectronDev = (): Plugin => {return {name: 'vite-electron-dev',// 在...
Select a variant: » vue-ts 3. 进入且运行 进入项目,在运行前需要先安装下依赖。 npm install npm run dev 4. 安装electron npm add --dev electron 5. 配置文件 (1)vite.config.js import { defineConfig } from 'vite'import vue from'@vitejs/plugin-vue'import path from'path'//新增//https:...
所以我们需要修改vite.config.ts配置文件,以此将electron和vite项目结合起来。 代码如下: import { defineConfig } from "vite";import vue from "@vitejs/plugin-vue";import * as path from "path";import electron from "vite-plugin-electron";import electronRenderer from "vite-plugin-electron/renderer";im...
先用Vite创建一个Vue3的工程,这就是你的实际项目工程 接着安装几个Electron相关的依赖,最终我的工程下的依赖情况如下: 代码语言:javascript 代码运行次数:0 运行 AI代码解释 "@vue/compiler-sfc":"^3.0.0","vite":"^1.0.0-rc.9","vue":"^3.0.2","vue-router":"^4.0.0-rc.1","electron":"^11.0...
Electron+Vite+Vue3的组合为开发者提供了一个高效、灵活的跨平台桌面应用开发框架。结合Go语言开发的后台API框架,能够构建出功能丰富、性能卓越的完整应用生态。无论是独立开发桌面应用,还是与后端服务紧密集成,都能获得良好的开发体验和用户体验。 未来,随着前端技术和Node.js生态的不断发展,Electron框架将继续发挥其优...
作者:周文武,Electron+Vue3+Vite搭建一个桌面应用:现实问题得益于Vite卓越的前端开发体验,越来越多的Electron项目也开始应用它来构建开发。翻阅各种社区资源可以发现很多基于Vite搭建的Electron开发模板,但都存在着一些共同的问题:配置相
Vue 3 是一个流行的前端框架,而 Vite 是一个现代的前端构建工具,它们与 Electron 的结合可以极大地提高开发效率。 以下是一个简要的步骤指南,帮助你使用 Vue 3 + Vite + Electron 搭建桌面应用: 初始化 Vue 3 + Vite 项目: bash npm create vite@latest my-electron-app -- --template vue-ts cd my-...
创建vite+vue3+ts项目 创建项目可参考:vue3+ts项目构建 安装electron相关依赖 npm install -D electron electron-builder electron-devtools-installer vite-plugin-electron vite-plugin-electron-renderer rimraf 新建electron-main/index.ts文件 import { app, BrowserWindow } from "electron"; ...
针对于我们当前的Electron+Vue3+TS项目,主要实现以下需求。 需求如下: 在渲染进程中,直接调用某个方法即可打开新窗口。 默认打开的新窗口是一个子窗口。 打开新窗口方法可以接收参数。 可以传入路由地址,新窗口渲染此路由地址页面。 可以传入窗口样式,如宽高、背景色、是否显示默认菜单栏等等。