cnpm create electron-vite cnpm i 或 cnpm create @quick-start/electron@latest 打包electron项目 npm run build 或通过以下指令来打包对应的平台包 如果卡在download提示github的网络问题导致打包失败,则自己根据报错提示链接先下载对应的包,再手动放到对应的目录即可,以下是各
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"; import* as path from "path";//本地启动的vue项目路径const localAddress = "http://localhost:5...
3.2 新建 electron-main/window.ts 文件 前面的 index.ts 只是主进程的入口文件,接下来我们需要编写真正创建窗口、创建托盘、监听事件等方法的文件了:window.ts。 这个文件我们主要编写以下几个函数: getWindow(id: number):获取当前窗口 createWindows(options: object):创建新的窗口 createTray():创建系统托盘 liste...
该包主要是为了方便我们开发和调试electron,可以去官网详细了解:electron-devtools-installer。 安装vite-plugin-electron: npm install vite-plugin-electron -D 该包集成了Vite和Electron,比如使用它之后可以让我们方便的在渲染进程中使用Node API或者Electron API,详细使用用法可以去官网学习:vite-plugin-electron。 安装r...
yarn create vite electron-desktop--template vue-ts 先使用 vite 创建 vue 项目,然后我们再将 electron 嵌入到里面 初始化完成后,我们先做一个本地 yarn 源的配置,防止下载库的时候出现异常。 配置.yarnrc 代码语言:javascript 代码运行次数:0 运行
我们需要先借助Vite初始化一个Vue3+TS的项目,后面我们在逐步添加electron,在任何一个文件夹下: 执行命令: npm create vite@latest my-vue-app -- --template vue-ts 安装依赖: npm install 运行项目: npm run dev 这样一个最简单的Vue3 + TS + Vite的前端项目就初始化好了。
针对于我们当前的Electron+Vue3+TS项目,主要实现以下需求。 需求如下: 在渲染进程中,直接调用某个方法即可打开新窗口。 默认打开的新窗口是一个子窗口。 打开新窗口方法可以接收参数。 可以传入路由地址,新窗口渲染此路由地址页面。 可以传入窗口样式,如宽高、背景色、是否显示默认菜单栏等等。
Electron 相关放在electron Vue + Vite 作为前端经常使用的,简单提一下 执行创建 Vue 项目指令 npm create vue@latest 创建一个包含Vue + Vite + TS + Pinia + ESLint + Prettier的项目 Vue3.4 至于标题特地指出Vue3.4版本,主要是新出的几个特性比较香,这里简单提一下 ...
我们希望npm run dev的时候直接把electron也启动起来而不是开两个启动一次vite再启动一次electron 第一步我们需要先建立一个文件夹 在根目录创建一个plugins编写vite插件帮我们启动electron plugins vite.electron.dev.ts //编写electron开发模式 vite.electron.build.ts //打包electron项目 ...
yarncreatevite electron-desktop--template vue-ts 1. 先使用 vite 创建 vue 项目,然后我们再将 electron 嵌入到里面。 初始化完成后,我们先做一个本地 yarn 源的配置,防止下载库的时候出现异常。 配置.yarnrc 复制 registry"https://registry.npm.taobao.org/"electron_mirror"https://npm.taobao.org/mirrors...