Question

我一直试图在Electron App中运行一些基本的React示例，但是没有任何显示，即使没有错误。

这是一个文件：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
    <div id="root"></div>

    <script type="text/babel">
      const React = require('react');
      const ReactDOM = require('react-dom');

      ReactDOM.render(
        <h1>Hello World</h1>,
        document.getElementById('root')
      );
    </script>
  </body>
</html>

我安装了以下软件包：react，react-dom和electron。难道我做错了什么？提前谢谢！

Answer 1

type="text/babel"并未被浏览器识别为有效的脚本类型，因此它会忽略它并完全跳过它，因此没有任何错误。您需要包含babel脚本以使其解析，如下所示：

<body>
  <div id="root"></div>

  <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
  <script type="text/babel">
    // your react code here
  </script>
</body>

这对于探索和原型设计来说很好，但是如果您想要发布应用以供其他人使用，那就不好了。让babel即时解析脚本可能会影响性能和内存使用。

相反，请查看有关如何预编译脚本并以这种方式运行脚本的教程。 This boilerplate could serve as a good reference.

React不会在Electron App中渲染

1 个答案: