创建Electron React项目

已于 2025-04-14 10:34:44 修改
阅读量149 收藏
点赞数 2
CC 4.0 BY-SA版权
文章标签： electron react.js 前端
于 2025-04-14 10:21:33 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/atec2000/article/details/147207488
atec2000
关注
electron vite react 创建一个项目
读心悦
07-01 482
你可以使用 Vite 的开发服务器来启动你的 React 应用，并在 Electron 中加载它。但是，请注意，由于 Electron 使用了 Node.js 的环境，你可能需要一些额外的步骤来确保 Vite 的开发服务器和 Electron 可以正常工作。当你的应用开发完成后，你可以使用 Vite 构建生产版本，并使用 Electron 打包工具（如 electron-builder 或 electron-packager）来打包你的应用。这些组件将构成你的 Electron 应用的用户界面。
React+Electron搭建桌面应用方法和步骤
刻痕
06-13 4979
React+Electron搭建桌面应用方法和步骤 步骤： 【一： 创建、运行】 1. 创建react 项目应用 2. react 项目内安装 Electron 依赖项 3. 修改 package.json 文件 4. 新建主线程文件 main.js 主线程文件 5. 添加 定义执行命令 【二： 打包】 . 【1.1】创建react 项目应用 详见我另一个博客： react+js或react+ts(tsx)使用creat-react-app、yarn搭建步骤 创建 react 应用： /
如何利用react框架快速创建一个electron项目
weixin_43354152的博客
06-30 999
如何利用create-react-app工具快速搭建一个react框架下的electron项目。
electron 结合 react(cra创建的) 创建桌面应用和打包桌面应用
最新发布
lotpyve的博客
05-09 1325
我们开两个终端一个先执行 npm run start ，注意，这里需要等项目启动之后，再在另外一个终端中执行 npm run dev:ele。我们可以把刚刚的项目关闭后，直接在一个终端中输入 npm run dev 试试，就会发现，目前项目只会自己打开电脑桌面端了。wait-on 用于配合 concurrently ，在一个终端中，等上一个命令执行成功之后，在执行下一个命令。1，我们需要打开两个终端，一个执行完成之后我们在执行另外一个，可不可以直接在一个终端中进行操作；
Electron+React 搭建桌面应用
hxy199421的博客
04-10 2466
当用户点击一个按钮或者菜单项来执行这些操作时，渲染进程会向主进程发送一个消息，请求执行相应的操作。主进程接到消息后，调用系统API来完成文件操作，并将操作结果发送回渲染进程，渲染进程根据主进程的响应更新界面状态等。当用户在界面上点击最小化或者最大化，或者更改某些全局设置（如语言偏好、主题等）时，这些更改通常由渲染进程触发，但实际执行由主进程负责。在这种情况下，渲染进程调用主进程的方法以应用这些更改，但不需要等待主进程的回包，因为用户界面的响应可以立即更新，而不必等待设置保存的确认。
【前端框架篇】搭建一个 vite+react+electron 的项目实践
章魚尐芄子的博客
10-18 1518
使用 vite+react 自行设计开发一个 electron 的桌面应用（纯前端），本篇文章将介绍如何搭建一个 electron 的开发环境，便于后期应用的进一步开发与优化。
Electron结合React使用
问白的博客
03-26 1万+
React Electron 创建 react 工程 使用 create-react-app脚手架创建 react 工程 npx create-react-app my-app 安装 electron 本地项目安装electron 依赖 npm i electron --save 修改工程 修改package.json文件 在package.json 中添加 homepage和main字段...
react-electron:使用React创建Electron桌面应用程序的样板
05-06
易于理解和使用的样板代码，只需使用Reactjs即可创建Electron桌面应用程序。 包括React Router。 该项目由 ， 和引导。 使用React构建Electron App-视频教程 用法 克隆此存储库。 git clone ...
前端基于react、Electron构建桌面应用程序教程，教程送上
爱生活爱学习。
05-06 608
然后，你可以使用npm安装create-react-app工具，它可以帮助你快速搭建React应用程序的基础结构。你会看到一个Electron窗口打开，并加载你的React应用。现在，你可以开始开发你的React应用，并将其打包成一个完整的Electron桌面应用程序。使用create-react-app工具创建一个新的React应用。在React应用的根目录下，安装Electron作为开发依赖。现在，你可以启动React应用并在Electron中运行它。的新目录，并在其中初始化React应用程序。
electron-react-antd-antv-cli的sqlite3数据库集成版本.zip
01-04
标题 "electron-react-antd-antv-cli的sqlite3数据库集成版本.zip" 提示我们这是一个包含集成SQLite3数据库的Electron应用开发项目。Electron是一个开源框架，它允许开发者使用JavaScript、HTML和CSS来构建跨平台的...
手动创建Electron+React项目框架（建议直接看最后）
魏大大
03-24 603
话说，Electron的包是真的难安装，我经常失败，必要情况下需要使用梯子，同时配置代理端口。安装完Electron之后，在项目根目录下创建一个文件夹，用于存放Electron代码。快速创建了，如果你想使用其他的工具创建React项目也是没有问题的。在代码测试阶段，我们使用Electron加载URL。等到React启动完成后，再启动Electron。首先需要创建一个React项项目，这里就是用。，名字有点LOW，你可以自定义~~，但是打包之后的正式环境，需要加载。等待项目创建完成后，可以使用命令。
构建跨平台桌面应用：基于 Electron 与 React 的实战指南
一名热衷于技术的全栈开发者，专注于前端与后端的全面技术探索。在这里，我将分享我在技术领域的学习与成长，助力更多开发者的进步。
03-10 2217
本文从环境搭建、项目初始化、核心代码编写到构建与部署，全面介绍了如何基于 Electron 与 React 构建一个高性能跨平台桌面应用。通过大量代码示例和详细解析，你不仅掌握了 Electron 的基本概念和生命周期管理，还学会了如何利用 React 构建现代化 UI，以及如何利用 Webpack 与 Babel 实现高效打包和热更新。希望这篇实战指南能为你提供全新的视角和宝贵经验，助你在跨平台桌面应用开发中不断突破，打造出既美观又高效的现代化应用。
Electron: 拼接运行指令：启动React项目和electron项目
weixin_50236973的博客
11-18 449
Electron: 拼接运行指令：启动React项目和electron项目
Electron React Antd Antv CLI 项目教程
gitblog_00955的博客
09-14 727
Electron React Antd Antv CLI 项目教程 项目介绍 Electron React Antd Antv CLI 是一个基于 Electron、React、Ant Design 和 AntV 的开源项目脚手架。它旨在帮助开发者快速搭建一个现代化的桌面应用程序，结合了 Electron 的跨平台能力、React 的组件化开发模式、Ant Design 的 UI 组件库以及 An...
Electron打包React生成桌面应用方法
我是星星的博客
12-25 347
Electron是一个能让你使用JavaScript,HTML和CSS来创建桌面应用程序的框架。这些应用程序可以打包后在 macOS、Windows 和 Linux 上直接运行。在目前浏览器和移动端盛行的互联网环境下，跨平台的桌面应用开发，也为前端提供了一个新分支方向。
使用React和Electron进行环境设置和项目整合
2301_79326616的博客
10-05 198
在React应用的根目录中，创建一个新的文件夹"public/electron"，然后在该文件夹中创建一个名为"main.js"的文件。在React应用的根目录中，创建一个名为"public/electron"的文件夹，并在其中创建一个名为"main.js"的文件。这段代码是Electron的主进程代码，它创建了一个Electron窗口，并加载React应用的URL。这是Electron主进程的基本代码，它创建了一个Electron窗口，并加载React应用的URL。否则，请按照官方文档的指导安装它们。
React + Electron封装并打包成桌面应用
热门推荐
钟离龙的博客
08-10 2万+
Electron是什么 ​Electron 是一个由 GitHub 开发的开源库，通过将 Chromium) 和Node.js 组合并使用 HTML，CSS 和 JavaScript 进行构建 Mac，Windows，和 Linux 跨平台桌面应用程序。 原理： 上面已将说了，Electron 通过将 Chromium 和 Node.js 组合到单个 runtime 中来实现的. node...
用 electron-forge 搭建 React + Ts 的项目
深坑妙脆角的博客
01-19 1051
如果你有桌面应用开发的需求，且比较熟悉Web相关的技术，那么Electron会是一个非常不错的选择，本文将介绍如何用其构建一个应用Demo项目
创建 electron+react
12-29
### 创建一个使用 Electron 和 React 的项目 为了创建一个结合了 Electron 和 React 技术栈的应用程序，可以遵循如下方法： #### 准备工作环境 确保已经安装 Node.js 及 npm 或 yarn。这一步骤对于后续依赖项的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值