如何在Electron中包含Chrome DevTools？ [英] How to include Chrome DevTools in Electron?

问题描述

我仍然是Electron的新手，目前正在此处。

I'm still new to Electron which I'm currently following here.

我已阅读此 Chrome开发工具的-extension.md>页面，以便我可以轻松调试应用程序。我已经阅读了文档，但是一旦执行 electron< app-name> 命令，它将返回错误：提供的应用无效电子应用，请阅读文档，了解如何编写一个...

I've read this page regarding on how to include the Chrome DevTools so that I can debug my application easily. I've followed the documentation but once I execute the electron <app-name> command it returns an error: The app provided is not a valid electron app, please read the docs on how to write one...

这是我中的代码块main.js 文件：

var app = require('app');
var BrowserWindow = require('browser-window');

// Add Chrome DevTools extension for debugging
require('remote').require('browser-window').addDevToolsExtension('../react-devtools')

这就是我的项目结构：

- react-devtools
- src
  -- index.html
  -- main.js
- package.json

任何帮助将不胜感激。谢谢！

Any help would be greatly appreciated. Thanks!

推荐答案

也许我误会了，但是您可以执行 ctrl + shift + I 来拉起开发工具。

Maybe I am misunderstanding, but you can just do ctrl + shift + I to pull up dev tools.

或者，如果您想以编程方式进行操作，则可以使用以下方法：我的 main.js 文件中的行传递给电子。

Or alternatively if you are wanting to do it programmatically, the way I do it is include the following lines in my main.js file that is passed to electron.

var app = require('app');
var BrowserWindows = require('browser-window');
    
app.on('ready', function(){
    mainWindow = new BrowserWindow({width:800, height:600});
    mainWindow.webContents.openDevTools();
}

我相信部分问题可能是您没有在等待应用程序完成在尝试使用它之前先做好准备。

I believe part of your problem may be that you aren't waiting for the app to be ready before you try to do stuff with it.

这篇关于如何在Electron中包含Chrome DevTools？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！