渲染进程(Renderer Process): 每个 Electron 窗口对应一个独立的渲染进程,它们运行在 Chromium 渲染引擎中,负责显示用户界面。 主窗口(Main Window): 主窗口是应用程序的主界面,通常是一个 Chromium 窗口,用来显示 Web 内容。 系统托盘图标(Tray): 允许在桌面右下角显示小图标,提供应用程序的快速访问和交互。
在Electron应用程序的主进程中,你需要使用Electron提供的API来渲染React组件。在main.js文件中,使用以下代码: 代码语言:javascript 复制 const{app,BrowserWindow}=require('electron');constpath=require('path');functioncreateWindow(){constwin=newBrowserWindow({width:800,height:600,webPreferences:{nodeIntegration:tru...
在之前我们知道electron通过main.js这个文件里new一个BrowserWindow来新建一个窗口,同样的,这个应用的弹窗,也可以通过new一个BrowserWindow来新建: 代码语言:javascript 复制 const{app,BrowserWindow}=require('electron')functioncreateWindow(){// 创建浏览器窗口constwin=newBrowserWindow({width:800,height:600,webPreferenc...
})//加载应用---react 打包//mainWindow.loadURL(url.format({//pathname: path.join(__dirname, './build/index.html'),//protocol: 'file:',//slashes: true//}))//加载应用---适用于 react 项目和开发阶段npm run electronmainWindow.loadURL('http://localhost:3000/'); mainWindow.on('closed'...
终端执行命令npx create-react-app react-electron自动进行配置安装 进入react-electron目录下执行yarn start,项目自动运行在 3000 端口 2️⃣-Demo 配置 electron 主进程 因为public文件夹不会被webpack打包处理,会直接复制一份到dist目录下,所以在public中新建electron.js作为主进程 ...
Electron和Create-React-App 使用electron-vite 简易版 npm install --save-dev electron package.json配置文件中的scripts字段下增加一条start命令 { "scripts": { "start": "electron ." } } 可以在开发模式下打开应用 基础的环境搭建只需要三个文件 ...
要使用React和Electron构建跨平台的桌面应用,可以按照以下步骤进行: 安装Node.js和npm:首先确保你的电脑上安装了Node.js和npm(Node Package Manager)。 创建一个新的Electron项目:使用Electron提供的命令行工具创建一个新的Electron项目。可以使用以下命令来安装Electron CLI工具: ...
1. 安装Electron 首先,你需要安装Electron。在终端中运行以下命令: npm install electron --save-dev 1. 2. 创建Electron应用程序 使用Electron提供的CLI工具,你可以创建一个Electron应用程序。在终端中运行以下命令: npx electron-forge init my-app 1.
1、Electron:**electron是一个使用js,html和css等的web技术创建原生桌面应用的框架,他基于chromium和node.js,构建的应用可以在Mac,windows和Linux三个平台上运行。 2、React和react-router在该项目中负责构建单页面应用和路由跳转的实现。 3、Antd作为UI框架。
1、Electron:electron是一个使用js,html和css等的web技术创建原生桌面应用的框架,他基于chromium和node.js,构建的应用可以在Mac,windows和Linux三个平台上运行。 2、React和react-router在该项目中负责构建单页面应用和路由跳转的实现。 3、Antd作为UI框架。