- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我第一次在我的 MacBook 上试用 Electron,因为我想要一个可以在其中编写桌面应用程序的环境。在退休之前我是一名程序员,使用过各种语言,但没有太多 javascript。
我正在浏览在线教程以尝试创建一个只打开另一个窗口的小应用程序。我设置了 main.js、index.js 和 index.html 文件。我正在努力解决几个错误,我认为它们与“远程”调用有关。
在 index.js 中,当我包括:const BrowserWindow = electron.remote.BrowserWindow
当 main.js 加载 index.html 我得到错误:index.js:3 Uncaught TypeError: Cannot read property 'BrowserWindow' of undefined at index.js:3
当我取出“远程”时,main.js 加载 index.html 时没有错误,但是当我尝试使用按钮打开另一个窗口时,出现此错误:index.js:10 Uncaught TypeError: BrowserWindow is not a constructor at HTMLButtonElement.<anonymous> (index.js:10) (anonymous) @ index.js:10
我花了几天的时间在网上阅读,但我无法弄清楚这一点。我在 MacBook 上运行 Electron 。我希望得到一些帮助。我一直在阅读有关远程和渲染等的信息,但我不确定到底发生了什么。谢谢!
这是我的文件
main.js
// Modules to control application life and create native browser window
//require('@electron/remote/main').initialize()
const {app, BrowserWindow} = require('electron')
const path = require('path')
const url = require('url')
function createWindow () {
// Create the browser window.
const mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
})
// and load the index.html of the app.
mainWindow.loadFile('src/index.html')
// Open the DevTools.
mainWindow.webContents.openDevTools()
}
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(() => {
createWindow()
app.on('activate', function () {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (BrowserWindow.getAllWindows().length === 0) createWindow()
})
})
// Quit when all windows are closed, except on macOS. There, it's common
// for applications and their menu bar to stay active until the user quits
// explicitly with Cmd + Q.
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') app.quit()
})
索引.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World!</title>
<link rel="stylesheet" href="../assets/css/main.css">
<link rel="stylesheet" href="../assets/css/add.css">
</head>
<body>
<h1>Hello World!</h1>
<div class="row">
<div id="price-container">
<p class="subtext">Current BTC USD</p>
<h1 id="price">$9,503.21</h1>
</div>
<div id="goal-container">
<p><img src="../assets/images/up.svg"><span id="targetPrice">Choose a Target Price</span></p>
</div>
<div id="right-container">
<button id="notifyBtn">Notify me when..</button>
</div>
</div>
<script src="index.js"></script>
</body>
</html>
index.js
const electron = require('electron')
const path = require('path')
//const BrowserWindow = electron.remote.BrowserWindow
const BrowserWindow = electron.BrowserWindow
const notifyBtn = document.getElementById('notifyBtn')
notifyBtn.addEventListener('click', function (event) {
const modalPath = path.join('file://', __dirname, 'add.html')
let win = new BrowserWindow(
{
width: 400, height: 200,
webPreferences: {
nodeIntegration: true
}
}
)
win.on('close', function () { win = null })
win.loadURL(modalPath)
win.show()
})
最佳答案
我也在使用 MacBook,我想出了如何打开一个新的 BrowserWindow
单击按钮时。您必须使用 工控机 从 Electron 。在您的 .html 中,当您有按钮时,在文件末尾放置一个简单的脚本,如下所示:
<body>
<h1>Hello World!</h1>
<button id=open>Open</button>
</body>
<script type="text/javascript">
const electron = require('electron');
const { ipcRenderer } = electron;
document.getElementById('open').addEventListener('click', event => {
ipcRenderer.send('main:add');
});
</script>
然后在您的 Electron 主文件(对我来说是一个
index.js
文件)中输入以下内容:
let addWindow;
ipcMain.on('main:add', event => {
addWindow = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
enableRemoteModule: true
}
});
addWindow.loadURL(`file://${__dirname}/index.html`);
addWindow.webContents.openDevTools();
addWindow.on('closed', () => {
addWindow = null;
});
});
当然你必须定义你的
.html
要在新窗口中打开的文件。 (对我来说这是一个
index.html
)。
yourWindowNameInElectron.webContents.send('eventName')
在 Electron 主文件和
ipcRenderer.on('eventName')
在你的 html 中。注意electron中的事件必须和html中的事件名称相同。
关于javascript - BrowserWindow 不是构造函数或未定义 - Electron,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64163175/
以下代码有效: import { app, BrowserWindow } from 'electron'; class Main { static mainWindow: Electron.
代码引用 : https://github.com/aredfox/screencapturer 问题描述 : Here是 electron带有“MainWindow”的应用程序,其中包含一个“开始捕
我的标题可能没有正确表达我的问题,但我找不到简洁的方法来表达问题。 问题是这样的: 我有一个由 IPC 事件触发的 BrowserWindow。当 BroswerWindow 打开时,它会向主进程发送
我调用 dialog.showOpenDialog() 来查找文件夹的路径。但问题是这不会阻塞 mainWindow。当标准路径选择 GUI 出现时,程序必须在路径选择完成后才能继续工作。谷歌搜索并意
在 electron.service.ts 的文件夹 providers 中,我有代码: import { Injectable } from '@angular/core'; // If you i
我第一次在我的 MacBook 上试用 Electron,因为我想要一个可以在其中编写桌面应用程序的环境。在退休之前我是一名程序员,使用过各种语言,但没有太多 javascript。 我正在浏览在线教
我的应用程序是全屏游戏的叠加层(alwaysOnTop),当用户单击我的叠加层时,它会获得焦点并在他们的游戏顶部显示任务栏。集中注意力很好,但我不能显示任务栏。 它在 BrowserWindow do
如果我的 Electron 应用程序打开和关闭了许多BrowserWindow,那么每个应用程序是否都具有唯一的ID? 因此,在我的应用一次运行中,如果我打开一个BrowserWindow并关闭它,然
我希望我的主窗口是屏幕的100%,而不是全屏,并且不能调整大小。 const electron = require('electron'); const url = require('url'); c
刚刚开始使用 Electron,我希望能够使用 loadURL 加载页面,但不替换整个页面。 这里的想法是如何使用像部分/模板这样的东西,这样我就可以在顶部和底部拥有一致的布局,但将不断变化的内容引入
请问有没有动态设置位置或将浏览器窗口移动到右下角的方法? BrowserWindow.setPosition(x, y) 最佳答案 您可以使用 the screen API ,并使用 fixed wi
有没有办法在 electron 中关闭 BrowserWindow 时返回值? 充其量我希望有一种方法可以从关闭事件中获取变量: win.on('closed', function(variables
当我创建一个新的 BrowserWindow 并使用 loadURL 在渲染器中使用一个 html 文件时,我猜在加载 css 之前我可以看到一闪而过的无样式内容半秒钟。 window.loadURL
我正在创建多个 UI 测试,而不是打开 Microsoft.VisualStudio.TestTools.UITesting.BrowserWindow 的新实例,我想检查 BrowserWindow
问题 是否有可能在 Electron 中制作一个BrowserWindow,透明和模糊?因为它模糊了所有背景内容,包括应用程序和墙纸。 如果可能的话,我将如何做到这一点? 例子 这是我试过的一些代码。
const BrowserWindow = require('electron') const win = new BrowserWindow({ width: 800, height: 600 })
我正在使用 BrowserWindow.loadURL("http://google.com") 在 ElectronJS 中加载页面。稍后在我的应用程序中,我需要通过一些哈希值(例如 http://
我对 Electron 、nodejs 和 javascript 很陌生,但我一直在稳步学习,取得了不错的结果,但我在这里遇到了一些障碍,并且没有找到类似的问题。然而,我确实找到了一个有人以相同方式使
我想从渲染进程中创建一个“Worker”BrowserWindow。工作进程将进行一些长时间运行的计算并定期返返回告。 看起来我可以使用 remote 模块在渲染器进程中执行此操作,而不是直接在主进程
我想知道BrowserWindow位于两个或多个屏幕上。 我猜 Electron API 没有给出方法。我怎样才能做到这一点?有什么办法吗?? 最佳答案 没有直接的方法可以实现这一点。但是以下绝对可以
我是一名优秀的程序员,十分优秀!