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

相关推荐
敲代码的约德尔人15 小时前
React Compiler 完全指南:2026 年自动性能优化的革命
react.js
哈__20 小时前
ReactNative项目OpenHarmony三方库集成实战:react-native-device-info
javascript·react native·react.js
庄小焱20 小时前
React——React基础语法(2)
前端·javascript·react.js
大雷神20 小时前
HarmonyOS APP<玩转React>开源教程十五:首页完整实现
react.js·开源·harmonyos
yzin1 天前
【源码】【react】useCallback、useMemo、memo 原理
前端·react.js
Neptune11 天前
让我带你迅速吃透React组件通信:从入门到精通(中篇)
前端·react.js·面试
弓.长.1 天前
ReactNative for OpenHarmony项目鸿蒙化三方库:react-native-webview — 网页渲染组件
react native·react.js·harmonyos
Highcharts.js1 天前
React 如何实现大数据量图表(性能优化指南)
前端·javascript·react.js·信息可视化·集成·highcharts
旭久1 天前
web前端开发好物推荐-(code-inspector-plugin/react-dev-inspector)页面快捷定位代码位置
前端·react.js·前端框架