React.js 怎么安装

发布时间：2026-08-31 04:09:18 来源：亿速云阅读：91 作者：小樊栏目：编程语言

在 React.js 中，通常不推荐直接通过 CDN 手写脚本引入，而是使用官方推荐的 构建工具 来创建项目。下面按常见方式给你说明。

✅ 推荐方式（最常用）：使用 Create React App

1️⃣ 安装 Node.js

React 依赖 Node.js 环境。

官网下载：https://nodejs.org
建议安装 LTS 版本

安装完成后，检查版本：

node -v
npm -v

2️⃣ 创建 React 项目

在命令行中执行：

npx create-react-app my-app

my-app 是你的项目名，可自定义

⏳ 等待安装完成（第一次会稍慢）

3️⃣ 启动项目

cd my-app
npm start

浏览器会自动打开：

http://localhost:3000

✅ 到这里，React 已成功安装并运行！

✅ 项目结构说明（简要）

my-app
├── public
├── src
│   ├── App.js
│   └── index.js
├── package.json
└── README.md

src/App.js：主组件
src/index.js：入口文件

✅ 不推荐但可用：CDN 引入（学习用）

仅适合学习或演示：

<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8" />
  <title>React CDN</title>
  <script src="https://unpkg.com/react@18/umd/react.development.js"></script>
  <script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
  <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
</head>
<body>
  <div id="root"></div>

  <script type="text/babel">
    function App() {
      return <h1>Hello React</h1>;
    }
    ReactDOM.createRoot(document.getElementById("root")).render(<App />);
  </script>
</body>
</html>

⚠️ 不建议用于实际项目

✅ 常见问题

❓ 需要安装 React 吗？

不需要单独安装 React，
create-react-app 会自动安装 react 和 react-dom

❓ 可以用 yarn 吗？

可以：

yarn create react-app my-app

如果你愿意，我可以：

✅ 教你 React 基础语法
✅ 用 Vite 创建 React 项目（更快）
✅ 给你一个 React 学习路线图

你现在用的是 Windows / macOS / Linux？

向AI问一下细节