ElectronJS:未被捕获的TypeError:无法读取属性"BrowserWindow"/"getCurrentWindow"未定义 [英] ElectronJS: Uncaught TypeError: Cannot read property "BrowserWindow" / "getCurrentWindow" of undefined

查看:222
本文介绍了ElectronJS:未被捕获的TypeError:无法读取属性"BrowserWindow"/"getCurrentWindow"未定义的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

首先,我知道这只是一个初学者会问的问题,但是在经历了50多种不同的解决方案,卸载npm和安装yarn之后,我不得不问这个令人难以置信的愚蠢问题.为什么不起作用?我想使用ElectronJS实现一个简单的标题栏,我遇到的问题是按钮(关闭/最小化/最大化)不起作用.我收到的错误如下:

First of all, I know that this is a question only a beginner would ask, but after going through more than 50 different solutions, uninstalling npm and installing yarn I have to ask this incredible dumb question. Why doesnt this work? I want to implement a simple titlebar using ElectronJS, the problem that I have is that the buttons (Close / Minimize / Maximize) do not work. The errors that I receive are the following:

最小化错误: titlebar.js:16未捕获的TypeError:无法读取HTMLButtonElement.maximizeApp(titlebar.js:16)上未定义的属性'BrowserWindow'

最大化错误: titlebar.js:16未捕获的TypeError:无法读取HTMLButtonElement.maximizeApp(titlebar.js:16)上未定义的属性"BrowserWindow"

退出错误: titlebar.js:21未捕获的TypeError:无法读取HTMLButtonElement.quitApp(titlebar.js:21)上未定义的属性'getCurrentWindow'

我用来控制它的JavaScript文件称为titlebar.js.就是这样:

The JavaScript file that I use to control this is called titlebar.js. This is it:

const remote_v = require("electron").remote;

var minimize_v = document.getElementById("minimize");
var maximize_v = document.getElementById("maximize");
var quit_v = document.getElementById("quit");

minimize_v.addEventListener("click",minimizeApp);
maximize_v.addEventListener("click",maximizeApp);
quit_v.addEventListener("click",quitApp);

function minimizeApp(){
  remote_v.BrowserWindow.getFocusedWindow().minimize();
}

function maximizeApp(){
  remote_v.BrowserWindow.getFocusedWindow().maximize();
}

function quitApp(){
  remote_v.getCurrentWindow().close();
}

由于针对此类其他问题的许多修复程序都在渲染过程中,因此这是HTML文件:

Since many of the fixes for other problems like this is in the render process, this is the HTML File:

<!DOCTYPE html>
    <head>
        <title>Visionizer</title>

        <link rel="stylesheet" href="css/editor.css">
        <link rel="stylesheet" href="css/titlebar.css" >
    </head>
    <body>
        <div class="container">         
            <div class="titlebar titlebarStyle">  
                <div class="windowTitle"> Visionizer </div>
                <div class="windowControls windowControlsStyle">
                    <button id="minimize">-</button>
                    <button id="maximize">[]</button>
                    <button id="quit">x</button>
                </div>
            </div>
            <div class="editorScreen">
            </div>
        </div>
        <script src="js/titlebar.js"></script>
    </body>
</html>

关于这件事的怪异之处是,经过大量尝试,我决定从github的教程中复制代码,我认为我的代码中可能有一个错误,我看不见.它仍然没有运行.我用 npm 卸载了该软件包,并使用 yarn global add electro @ latest yarn 安装了该软件包,因为有人建议这样做.

The weird thing about this is that, after much trying, I decided to copy the code from the tutorial from github, I thought that there may have been an error in my code that I was too dumb to see. It still didn't run. I uninstalled the package with npm and installed it with yarn using yarn global add electron@latest since some people suggested this.

我根本不知道这是否很重要,但是我也将从下面的main.js文件中复制代码,因为我想确保自己包括了所有内容:

I do not know whether this is important at all, but I will also copy my code from the main.js-file below since I want to be sure that I included everything:

const { app, BrowserWindow } = require('electron')

function createWindow () {
  const win = new BrowserWindow({
    width: 900,
    height: 800,
    minHeight: 650,
    minWidth: 600,
    frame: false,
    webPreferences: {
      nodeIntegration: true
    }
  })

  win.loadFile('editor.html')
  win.webContents.openDevTools()
}

app.whenReady().then(createWindow)

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

这是package.json文件:

And here is the package.json file:

{
  "dependencies": {
    "electron": "^11.0.2"
  },
  "name": "*******",
  "version": "1.0.0",
  "description": "**********",
  "main": "main.js",
  "scripts": {
    "start": "electron ."
  },  
  "author": "************",
  "license": "MIT"
}

互联网上的一些问题被回答为该项目启动错误,我听从了他们的建议,我使用 yarn start 命令启动项目

Some questions on the internet were answered by saying that the project was started wrongly, I followed their advice, I start my projects using the yarn start command

感谢您阅读本章.

推荐答案

您的远程模块似乎是 undefined .

您要设置 enableRemoteModule:true 在主窗口的 webPreferences 中,或者更好的是,完全删除 remote 并从主进程中执行这些操作.

You'd want to set enableRemoteModule: true in your main window's webPreferences, or better yet, scrap remote altogether and do these operations from the main process.

中禁用了 remote 模块.电子10 .

The remote module was disabled in Electron 10.

这篇关于ElectronJS:未被捕获的TypeError:无法读取属性"BrowserWindow"/"getCurrentWindow"未定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆