Question

我创建了一个非常基本的ReactJs组件。

我创建了一个html文件。代码如下

<!DOCTYPE html>
<html>
<head>
    <meta charset="I`enter code here`SO-8859-1">

    <title>Basics of React</title>

</head>
<body>
    <div id="example"></div>


    <script src="../build/react.js"></script>
    <script src="../build/react-dom.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
    <script type="text/babel" src="../js/ReactBasic.js"></script>

</body>
</html>

js文件代码在

之下

 ReactDOM.render(
    <h1>This content is from a React Component!</h1>,
    document.getElementById('example')
);

问题在于，当我尝试运行相同的时候。它没有显示我试图渲染的React组件。然而，如果我嵌入一个html文件，它的工作正常。这个问题不是React库附带的示例，而是与我创建的htmls有关。这清楚地表明没有装载问题。

我是React的新手，因此想确认这里可能出现的问题。

Answer 1

由于您没有使用npm，因此JS文件的路径会发生这种情况。它无法找到您的JS文件，因此无法加载到DOM中。

要解决此问题，您有两种选择：

将您的JS和HTML文件放在同一目录中并更新HTML文件中的路径
使用位于单独目录中的JS文件的绝对路径。

外部js fille中的Reactjs组件有时不会加载

1 个答案: