在前端开发中，如果你使用React框架进行开发，可能会遇到Uncaught ReferenceError: React is not defined的错误。这个错误通常是由于未正确引入React库导致的。
错误原因
当浏览器在加载JavaScript文件时，如果遇到未定义的标识符，就会抛出ReferenceError异常。在React应用程序中，这通常意味着没有正确引入React库。
例如，在以下代码中：
-- -------------------- ---- -------
------ ----- ---- --------
-------- ----- -
------ -
-----
------ ------
------
--
-
-------------------- --- ---------------------------------如果你没有正确地将React库导入到你的项目中，那么当浏览器尝试运行该代码时，它将无法识别React变量并抛出一个ReferenceError异常。
解决方法
为了解决这个问题，你需要正确地在你的项目中导入React库。你可以通过不同的方式来导入React库，这里列出两种常见的方式：
方式一：使用CDN
你可以通过将以下代码添加到HTML文档的head部分来使用CDN导入React库：
<script src="https://cdn.jsdelivr.net/npm/react@17.0.2/umd/react.development.js"></script> <script src="https://cdn.jsdelivr.net/npm/react-dom@17.0.2/umd/react-dom.development.js"></script>
请注意，这里使用的是React 17.0.2版本的CDN链接。你也可以使用其他版本，但要确保与你的项目兼容。
方式二：使用包管理器
如果你使用npm或yarn等包管理器来管理你的项目依赖关系，那么你可以通过运行以下命令来安装React和ReactDOM库：
npm install react react-dom
或者
yarn add react react-dom
在你的JavaScript文件中引入React：
import React from 'react'; import ReactDOM from 'react-dom';
示例代码
以下是一个完整的示例代码，展示了如何正确地导入React库并解决Uncaught ReferenceError: React is not defined错误：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------ ---------------
-------
------
---- ----------------
------- ----------------------------------------------------------------------------------
------- ------------------------------------------------------------------------------------------
--------
-------- ----- -
------ -
-----
------ ------
------
--
-
-------------------- --- ---------------------------------
---------
-------
-------结论
当你看到Uncaught ReferenceError: React is not defined错误时，不要惊慌。这通常是由于未正确引入React库导致的。你可以通过使用CDN或包管理器来正确引入React库并解决该问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/26768