react-devtool看消息缓存与转发机制(electron版)

 electron

httpServer.on('request', (req, res) => {
    // Serve a file that immediately sets up the connection.
    var backendFile = readFileSync(join(__dirname, 'backend.js'));
    //res.end(backendFile + '\n;ReactDevToolsBackend.connectToDevTools();');
    res.end(backendFile );
  });

   

  在chrome 插件下的通信调试不够透明,且chrome 的插件特别是开发工具界面几乎无法调试。 看到了react-devtools 也提供electron 版本的调试工具。 正好学习一下。

   react-devtools-core/standalone.js : 渲染进程js. (websocket server 和 调试界面)

  react-devtools/app.js:主进程js

 react-devtools-core/src/backend.js: 网页加载的js。(解析__REACT_DEVTOOLS_GLOBAL_HOOK__ 钩子变量, 发送消息给websocket 服务器, 这里需要手动引入,chrome插件版可以自动注入)

猜你喜欢

转载自www.cnblogs.com/breakdown/p/10592894.html