这个问题太令人困惑了,因为我不知道问题在哪里
我使用振动在我的上一个项目与以前的电子版本在同一台机器和那些工作正常,但知道它不工作,我不知道是什么问题。
我谷歌它,我没有发现任何问题或github问题。
可能是电子出了问题?!!
这里有一些可能需要的信息:
- 系统:
- MacOS 11.6 x86_64
- 电子版本:15.0.0
- 其他依赖项或DevDependencies:Nothing
这是一个非常简单的例子,没有什么疯狂的事情发生。非常非常简单:
// File: index.js
// Process: Main
// Location: Root Directory Of Project
// -----------------------------------
const { app, BrowserWindow } = require('electron');
const { join } = require('path');
const isDarwin = process.platform === 'darwin';
let mainWindow;
app.setName('Electron Sample');
const Ready = () => {
mainWindow = new BrowserWindow({
show: false,
vibrancy: 'content',
visualEffectState: 'followWindow',
title: app.getName(),
backgroundColor: false,
webPreferences: {
contextIsolation: false,
nodeIntegration: true,
nativeWindowOpen: false
}
});
mainWindow.loadFile(join(__dirname, './index.html'));
mainWindow
.once('ready-to-show', () => mainWindow.show())
.once('close', () => (mainWindow = null));
};
app.whenReady().then(Ready);
app.on('window-all-closed', () => {
if (!isDarwin) app.quit();
});
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) Ready();
});
<!--
File: index.html
Process: Renderer
Location: Root Directory Of Project
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
html,
body {
background-color: transparent;
width: 100vw;
height: 100vh;
}
</style>
</head>
<body>
<h1>I Confused! 😭</h1>
</body>
</html>
项目结构:- node_modules
- index.js
- index . html
- yarn.lock
- package.json
这是所有的信息。
问题在BrowserWindow选项
这是在macOS上启用窗口下振动的正确选项:
new BrowserWindow({
// Other Options...
transparency: true,
backgroundColor: "#00000000" // transparent hexadecimal or anything with transparency,
vibrancy: "under-window", // in my case...
visualEffectState: "followWindow"
})
更多信息:电子浏览器窗口选项