当前位置:首页 > React

如何再npm下安装react

2026-01-25 03:09:06React

安装 Node.js 和 npm

确保已安装 Node.js 和 npm。Node.js 自带 npm,可通过 Node.js 官网 下载并安装最新稳定版。安装完成后,在终端运行以下命令验证版本:

node -v
npm -v

创建 React 项目

使用官方工具 create-react-app 快速搭建 React 项目。运行以下命令全局安装该工具(若已安装可跳过):

npm install -g create-react-app

通过以下命令创建新项目(将 my-app 替换为项目名称):

如何再npm下安装react

npx create-react-app my-app

进入项目目录并启动

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

cd my-app
npm start

此时浏览器会自动打开 http://localhost:3000 并显示默认 React 页面。

如何再npm下安装react

安装其他依赖(可选)

如需额外安装库(如 react-router-dom),在项目目录下运行:

npm install react-router-dom

生产环境构建

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

npm run build

构建结果会保存在 build 文件夹中。

标签: npmreact
分享给朋友:

相关文章

react如何调试

react如何调试

调试 React 应用的方法 使用 React Developer Tools React Developer Tools 是 Chrome 和 Firefox 的浏览器扩展,可以检查组件树、状态和…

react如何配置

react如何配置

配置React项目的基本步骤 安装Node.js和npm 确保系统已安装Node.js(包含npm)。可通过命令行检查版本: node -v npm -v 创建React项目 使用官方工具Creat…

react如何引入echarts

react如何引入echarts

安装 ECharts 依赖 在 React 项目中安装 ECharts 核心库和 React 封装库: npm install echarts echarts-for-react 基础引入方式 创建…

react如何滚动scroll

react如何滚动scroll

React 实现滚动的方法 使用 useRef 和 scrollTo 方法 通过 useRef 获取 DOM 元素的引用,调用 scrollTo 方法实现滚动。 import React, { us…

react如何引入jq

react如何引入jq

在React中引入jQuery的方法 React和jQuery可以共存,但需要注意避免直接操作DOM,因为React有自己的虚拟DOM机制。以下是几种引入jQuery的方式: 通过npm安装jQue…

react less如何配置

react less如何配置

在 React 项目中配置 Less 安装必要的依赖包,确保项目支持 Less 预处理样式。使用以下命令安装 less 和 less-loader: npm install less less-lo…