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

相关推荐
专注前端30年4 小时前
在日常开发项目中Vue与React应该如何选择?
前端·vue.js·react.js
风无雨5 小时前
在 React 中实现数学公式显示:使用 KaTeX 和 react-katex
前端·react.js·前端框架
前端无涯7 小时前
react组件(2)---State 与生命周期
前端·react.js
前端无涯7 小时前
react组件(3)---组件间的通信
前端·react.js
前端无涯8 小时前
react组件(1)---从入门到上手
react.js·前端框架
风止何安啊9 小时前
一场组件的进化脱口秀——React从 “类” 到 “hooks” 的 “改头换面”
前端·react.js·面试
前端无涯9 小时前
react---JSX完全指南:从基础语法到进阶实战
react.js·前端框架
Alair‎10 小时前
202React-Query:useMutation
react.js
是杉杉吖~11 小时前
《5 分钟上手 React Flex 容器:从 0 搭建响应式卡片列表》
前端·react.js·前端框架
2401_8603195211 小时前
在React Native中开发一个轮播组件(Swipe轮播),通过组件react-native-snap-carousel来实现
javascript·react native·react.js