当前位置:首页 > React

react npm如何安装

2026-02-12 02:51:35React

安装 Node.js 和 npm

React 项目依赖 Node.js 环境,因此需先安装 Node.js(包含 npm)。访问 Node.js 官网 下载 LTS 版本(推荐),安装完成后在终端运行以下命令验证安装:

node -v
npm -v

若正确显示版本号,则说明安装成功。

创建 React 项目

通过官方工具 create-react-app 快速初始化项目。全局安装该工具(非必须,但推荐):

npm install -g create-react-app

然后创建项目(替换 my-app 为你的项目名):

npx create-react-app my-app

进入项目目录并启动

创建完成后,进入项目目录并启动开发服务器:

cd my-app
npm start

默认情况下,浏览器会自动打开 http://localhost:3000 并显示 React 欢迎页面。

可选:使用 Yarn 替代 npm

若更倾向使用 Yarn,可全局安装后替代 npm 命令:

npm install -g yarn
yarn start

生产环境构建

开发完成后,生成优化后的生产环境代码:

react npm如何安装

npm run build

构建结果会保存在 build 目录中,可直接部署到服务器。

标签: reactnpm
分享给朋友:

相关文章

react如何循环

react如何循环

循环渲染列表 在React中循环渲染列表通常使用map方法,这是最常用的方式。通过map可以将数组中的每个元素转换为React元素并渲染到页面上。 const items = ['Apple', '…

react 如何精通

react 如何精通

掌握核心概念 深入理解React的基础概念,包括组件(函数组件与类组件)、状态(useState)、生命周期(useEffect)、Props传递、虚拟DOM与Diff算法。通过官方文档或《React…

如何读react源码

如何读react源码

理解React源码的结构 React源码托管在GitHub上,主要分为几个核心模块:react、react-dom、react-reconciler等。react包包含核心API和组件逻辑,react…

react 如何修改state

react 如何修改state

修改 state 的基础方法 在 React 中,state 的修改必须通过 setState 方法(类组件)或 state 更新函数(函数组件)。直接修改 state 会导致组件不会重新渲染,且可能…

react路由如何刷新

react路由如何刷新

React 路由刷新方法 在 React 中,路由刷新通常涉及以下几种场景和解决方案: 强制重新加载当前页面 使用 window.location.reload() 可以强制刷新整个页面,但会丢失…

react如何启动6

react如何启动6

安装 Node.js 和 npm/yarn 确保系统中已安装 Node.js(建议版本 16 或更高)和 npm/yarn。可通过以下命令验证版本: node -v npm -v 创建 Reac…