我是一个初学者用户，正在学习一个关于如何使用react的Scrimba教程。本质上，该教程开始直接使用React外部库（unpkg.com...），但后来切换到依赖项。我使用的是WebStorm。
所以，我修改了我的代码，以包括import语句，并删除了原始HTML文件中的脚本src标签。然而，一旦我这样做了，我就开始收到经典的"SyntaxError: Cannot use import statement outside a module"。在网上搜索后，我添加了“type”：“module”行添加到我的package.json文件中。然而，在这样做之后，我的.js文件似乎不再与React一起操作。我得到了一个SyntaxError: Unexpected token '<'。显然，IDE不喜欢JS文件中的html括号。下面是我的html，js和package.js文件的代码片段：
<body>
<div id="root"></div>
<script src="index.js"></script>
</body>import React from "react"
import ReactDOM from "react-dom"
ReactDOM.render(<h1>Hello</h1>, document.getElementById("root"))"type": "module",
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0"
}我知道这看起来像是一个非常基本的问题，但是我已经花了几个小时，我似乎不能弄清楚它。任何帮助都是感激的，谢谢！
1条答案
按热度按时间3pvhb19x1#
您使用的是React版本18，但要进行渲染，您使用的是ReactDOM.render（Hello，document.getElementById（“root”））一直使用到React版本17。React版本18将语法更改为ReactDOM.createRoot（document.getElementById（'root '））.render（），所以你只需要把render函数替换成新的createRoot函数。更多信息请查看这个。要么将react版本更改为17，因为Scrimba在我提到的课程中使用的是版本17，要么将渲染方法更改为版本18。