预检清单
- 我已阅读了此项目的 Contributing Guidelines。
- 我同意遵循此项目遵循的 Code of Conduct。
- 我在 issue tracker 中搜索了一个与我想要提交的 bug 报告相匹配的 bug,但没有成功。
Electron 版本
29.1.4
您正在使用的操作系统是什么?
Windows
您正在使用的操作系统版本是什么?
Windows 11 Home 23H2
您正在使用的架构是什么?
x64
最后已知正常工作的 Electron 版本
- 无响应*
预期行为
当我在开发者模式下启动我的 Electron 应用程序时,React Devtools 将被安装并附加到我的应用程序上。
实际行为
React Devtools 已安装,但未附加到我的应用程序上。需要手动重新加载或强制重新加载才能将其附加。如果我从 Chrome 扩展程序中手动安装 React Devtools,也必须手动重新加载。
测试用例 Gist URL
- 无响应*
其他信息
我的代码:
// Import required modules
const { default: installExtension, REACT_DEVELOPER_TOOLS } = require('electron-devtools-installer');
const path = require('path');
const { app, BrowserWindow } = require('electron');
// Initialize mainWindow variable
let mainWindow;
// Function to create the main window
const createWindow = async () => {
const isDev = await import('electron-is-dev');
// Configure the main window
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true, // Enable Node.js integration
enableRemoteModule: true, // Enable remote module
contextIsolation: false, // Disable context isolation
autoHideMenuBar: true, // Auto-hide menu bar
devTools: isDev.default, // Show DevTools in development
},
});
// Hide the menu bar
mainWindow.setMenuBarVisibility(true);
// Load the appropriate URL based on the environment
mainWindow.loadURL(
isDev.default
? 'http://localhost:3000' // Development URL
: `file://${path.join(__dirname, '../build/index.html')}` // Production URL
);
};
// Create the main window when the app is ready
app.whenReady().then(() => {
installExtension(REACT_DEVELOPER_TOOLS, { loadExtensionOptions: { allowFileAccess: true }})
.then((name) => {
console.log(`Added Extension: ${name}`);
// Create the window and the React application
createWindow();
})
.catch((err) => console.log('An error occurred: ', err));
});
// Quit the app when all windows are closed (except on macOS)
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit();
}
});
// Create a new window when the app is activated (macOS)
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});
我还尝试在我的代码中重新加载窗口或添加一个定时器来重新加载窗口,但没有成功。
9条答案
按热度按时间dm7nw8vv1#
这段文本是关于数学的,但它看起来像是乱码。请提供更多信息或上下文,以便我们能够更好地理解您的问题并提供帮助。
dwthyt8l2#
SantiagoChiappe,你在主进程中遇到了类似的错误(在#37876(评论)中报告)吗?
是的,只有在打开开发者工具时才会出现这个错误。当我使用“查看”->“重新加载”重新加载应用程序时,我还会遇到其他错误,但然后就像我之前提到的那样,react devtools会出现:
e5nqia273#
遇到了相同的问题
z18hc3ub4#
相同的问题,但在使用Vue开发工具时出现了异常,即使在重新加载后也无法加载。尝试打开开发工具时出现相同的错误。
kiayqfof5#
关于这个问题有任何更新吗?如何解决这个问题?
izj3ouym6#
通过使用
react-devtools
包而不是安装chrome扩展来解决这个问题。yarn add --dev react-devtools
"dev:react-devtools": "react-devtools"
或类似内容<script src="http://localhost:8097"></script>
添加到渲染器索引html文件的开发版本中yarn run dev:react-devtools
时,它将启动react-devtools服务器,并使react devtools在应用程序窗口的devtools中可用。xxhby3vn7#
通过使用
react-devtools
包而不是安装chrome扩展来解决这个问题。yarn add --dev react-devtools
"dev:react-devtools": "react-devtools"
或类似内容<script src="http://localhost:8097"></script>
添加到渲染器索引html文件的开发版本中yarn run dev:react-devtools
时,它将启动react-devtools服务器,并使react devtools在应用程序窗口的devtools中可用。在我的项目上可以正常工作。谢谢。
li9yvcax8#
iyr7buue9#
经过一些痛苦的建设和构建了大约20个不同的开发工具版本,我确定facebook/react@f718199在初始加载时破坏了它。目前还不确定原因,但现在有一个很好的线索。