Electron Forge - 无法在渲染器文件中使用 ipcRenderer [英] Electron Forge - Can't use ipcRenderer in the renderer file

问题描述

我刚刚使用以下命令创建了一个新应用程序:

I just created a new application using the following command:

npx create-electron-app my-new-app --template=typescript-webpack

在 renderer.ts 我添加了以下代码

Inside the renderer.ts I added the following code

import "./index.css";
import { ipcRenderer } from "electron";

但是当我运行 npm run start 我在浏览器控制台中出现以下错误

But when I run npm run start I have the following error in Browser Console

Uncaught ReferenceError: require is not defined

更新我试过的:

webpack.plugins.js

const ForkTsCheckerWebpackPlugin = require("fork-ts-checker-webpack-plugin");
const webpack = require("webpack");
module.exports = [
  new ForkTsCheckerWebpackPlugin(),
  new webpack.ExternalsPlugin("commonjs", ["electron"]),
];

但还是不行.

推荐答案

找到解决方案

解决方案是在预加载脚本中使用 ipcRenderer.

The solution is to use ipcRenderer in a preload script.

preload.ts

import { ipcRenderer } from "electron";

index.ts

declare const MAIN_WINDOW_PRELOAD_WEBPACK_ENTRY: any;

const mainWindow = new BrowserWindow({
  height: 600,
  width: 800,
  webPreferences: {
    preload: MAIN_WINDOW_PRELOAD_WEBPACK_ENTRY,
  },
});

package.json

  "plugins": [
    [
      "@electron-forge/plugin-webpack",
      {
        "mainConfig": "./webpack.main.config.js",
        "renderer": {
          "config": "./webpack.renderer.config.js",
          "entryPoints": [
            {
              "html": "./src/index.html",
              "js": "./src/renderer.ts",
              "name": "main_window",
              "preload": {
                "js": "./src/preload.ts"
              }
            }
          ]
        }
      }
    ]
  ]

这篇关于Electron Forge - 无法在渲染器文件中使用 ipcRenderer的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！