aio
(ALL in one) 是已配置好前端常用开发组件的 create-react-app
模版,项目开箱可用。
npx create-react-app my-app-aio --template aio
# http://localhost:3000
npm run start
组件名称 | 功能 |
---|---|
react-router-dom |
路由 |
zustand |
状态管理 |
react-i18next |
国际化 |
@mui/material @emotion/react @emotion/styled |
MUI 组件 |
react-hook-form @hookform/resolvers joi |
表单处理及数据校验 |
axios |
网络请求 |
husky lint-staged prettier eslint-config-alloy eslint-config-react-app stylelint-config-standard |
Code style |
@craco/craco |
Build config |
组件名称 | 功能 | 安装命令 |
---|---|---|
@mui/icons-material |
Material 图标 | npm install --save @mui/icons-material |
date-fns |
日期时间处理 | npm install --save date-fns |
lodash @types/lodash |
函数处理 | npm install --save lodash npm install --save-dev @types/lodash |
- 当使用
npx create-react-app my-app-aio --template aio
创建项目时- script
prepare
不会自动执行,需要项目创建后手动执行
- script
- 当使用
pnpm create react-app my-app-aio --template aio
创建项目时- script
prepare
不会自动执行,需要项目创建后手动执行 - 需要自己手动删除
package-lock.json
node_modules
,然后执行pnpm install
- script
- 当使用
yarn create react-app my-app-aio --template cra-template-aio
创建项目时- 不会自动运行
git init
- 不会自动运行
- 受限于
react-scripts
依赖限制,typescript
依赖目前只能支持到4.9.5
版本,可在packages.json
中添加orerrides
解决依赖问题
"overrides": {
"react-scripts": {
"typescript": "5.1.6"
}
}