Ant Design of React 创建项目及运行环境

Ant Design of React 学习笔记(1)

创建项目及运行环境

本文使用 create-react-app 创建一个 TypeScript 项目,并引入 antd。

1.命令行cd到对应的目录,这里是npm下回车运行,其他如pnpm yarn参考官网

npx create-react-app antd-demo --template typescript

antd-demo就是项目名称,可以自己随意起

2.进入项目并运行 cd到项目下运行 npm run start

cd antd-demo

npm run start

此时浏览器会访问 http://localhost:3000/ ,看到 Welcome to React 的界面就算成功了。

3.安装Ant design

npm install antd --save

回传运行安装完成

在package.json 文件下会看到antd 相关信息,如果要使用sass或者less预编样式、axios数据请求这些按需npm安装即可。
react-router-dom这个是路由,后面要用到路由跳转,项目目录下运行

npm install react-router-dom

相关推荐
Zkaisen9 小时前
mtreoCVE-2025-11953学习(目录遍历与远程命令执行)
学习·react native·react.js·metro
zzzzzz31010 小时前
react-bits 为什么会吸引前端开发者:别把动效当装饰,先把它当成页面能力
前端·react.js·动效
风月说与山鬼12 小时前
二、React入口文件(main.jsx)
前端·react.js
张元清1 天前
React useTimeout Hook:声明式 setTimeout 与自动清理 (2026)
javascript·react.js
嘟嘟07171 天前
JWT 登录认证完整流程(React + Vite 实战复习)
react.js·vite
meilindehuzi_a1 天前
React JWT 登录鉴权实战:从无状态 HTTP 到路由守卫、Zustand 与 Axios 拦截器
前端·react.js·http
张元清2 天前
React useEventListener Hook:类型安全的 DOM 事件监听 (2026)
javascript·react.js
l1m0_2 天前
React+Tailwind+AI 实战:连锁餐饮管理后台从零到一开发复盘
前端·react.js·ui·ai·ai设计
FungLeo2 天前
React 管理后台实战 · 多角色后台的菜单和路由怎么按角色收口?配置表驱动,新增权限不碰业务代码
前端·react.js·多角色菜单
FungLeo2 天前
React 管理后台实战 · 前端请求层怎么写?401 静默刷新、token 并发竞争、强制改密拦截一次说清
前端·react.js·前端框架