React 技术栈 - 快捷搭建

[jtwang7]

React 技术栈 - 快捷搭建

✅ 技术栈概览

• React
  • typescript
  • redux
  • react-router-dom
• Sass

❇️ React + typescript + redux + react-redux

$ yarn create react-app my-app --template typescript redux-typescript
#or
$ yarn create react-app my-app --template typescript
$ yarn add @reduxjs/toolkit
$ yarn add react-redux

❇️ Add react-router-dom v6

$ npm install react-router-dom@6
#17 
$ yarn add react-router-dom@6

❇️ Add Sass

$ npm install sass
# or
$ yarn add sass

❇️ Add axios

$ npm install axios
# or
$ yarn add axios

❇️ Add ahooks

$ npm install --save ahooks
# or
$ yarn add ahooks
# or
$ pnpm add ahooks

❇️ Add lodash.js

$ npm i --save lodash
or
$ yarn add lodash

❇️ Add classnames

# via npm
npm install classnames

# via Bower
bower install classnames

# or Yarn (note that it will automatically save the package to your `dependencies` in `package.json`)
yarn add classnames

❇️ Add antd

$ yarn add antd

修改 src/App.css，在文件顶部引入 antd/dist/antd.css。
@import '~antd/dist/antd.css';
// 若报错，引入
@import '~antd/dist/antd.min.css';