electron模板【lectron-react-boilerplate】多窗口配置【HtmlWebpackPlugin】多页面配置

如果您正在使用electron-react-boilerplate进行快速的Electron应用程序开发,您可能会遇到想要在桌面应用程序中拥有多个原生窗口的情况。

MacOS窗口图像

MacOS窗口图像由OpenClipart-Vectors提供,来源Pixabay

开始之前需要提及的事情!

  1. Electron有一个主进程和渲染进程的模式。可以有多个渲染进程,但只有一个主进程。
  2. 对于Electron IPC(进程间通信),我们需要一个预加载器。我们可以通过启用节点集成来实现,但这是一个安全隐患。
  3. webpack插件HtmlWebpackPlugin为每个入口(块)创建一个html文件。

如果您不想了解如何操作的细节,您可以直接克隆这个仓库并从中学习https://github.com/alielmajdaoui/electron-react-boilerplate-multiple-windows

开发环境设置

./src文件夹内,创建两个文件夹,settings-main用于主进程文件,settings-renderer用于渲染进程文件。

打开文件.erb/configs/webpack.paths.ts,在以下行之后

const srcRendererPath = path.join(srcPath, 'renderer');

添加

const srcSettingsMainPath = path.join(srcPath, 'settings-main');
const srcSettingsRendererPath = path.join(srcPath, 'settings-renderer');

在同一文件中,导出新变量。

文件.erb/configs/webpack.paths.ts应该看起来像

./erb/configs/webpack.paths.ts

创建设置窗口渲染进程

settings-renderer文件夹内,创建一个新文件index.ejs

./src/settings-renderer/index.ejs

在同一文件夹settings-renderer内,创建一个新文件index.tsx

./src/settings-renderer/index.tsx

将新的渲染入口添加到Webpack

打开.erb/configs/webpack.config.renderer.dev.ts,并找到以下代码块

  entry: [
    `web

相关推荐

  1. webpack怎么配置页面或者页面项目?

    2024-06-16 07:34:02       33 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-06-16 07:34:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-06-16 07:34:02       100 阅读
  3. 在Django里面运行非项目文件

    2024-06-16 07:34:02       82 阅读
  4. Python语言-面向对象

    2024-06-16 07:34:02       91 阅读

热门阅读

  1. 数据库面试

    2024-06-16 07:34:02       31 阅读
  2. MySQL的高可用方案:深入Galera Cluster和ProxySQL

    2024-06-16 07:34:02       75 阅读
  3. c++ 单例模式

    2024-06-16 07:34:02       23 阅读
  4. Elasticsearch机器学习初探:智能数据洞察

    2024-06-16 07:34:02       33 阅读
  5. 可以免费发外链的论坛有哪些?

    2024-06-16 07:34:02       33 阅读
  6. 012_redhat安装activemq

    2024-06-16 07:34:02       32 阅读
  7. Python

    Python

    2024-06-16 07:34:02      32 阅读
  8. 双指针【1】两数之和基础版 归并排序

    2024-06-16 07:34:02       29 阅读
  9. mybatis框架原理,组件,案例,优化,优缺点总结

    2024-06-16 07:34:02       31 阅读
  10. TPS、QPS、CPS、PV和UV

    2024-06-16 07:34:02       49 阅读