Use

git clone git@github.com:qqxs/react-antd-typescript-starter.gitcd react-antd-typescript-starterpnpm install

Scripts

# 安装项目依赖# only allow pnpmpnpm install# 开启开发环境react 编译# start development environmentpnpm run dev# 开始编译生产环境# production environmentpnpm run build# 开始编译生产环境并输出分析# production environment analyzerpnpm run analyzer# 对部分不符合eslint 语法进行修复# 注意⚠️: 不是所有的错误都会修复，部分还是要手动修复# eslint fix codepnpm run fix# 进行eslint语法检查, 如果有错会在控制中指出# eslint lint codepnpm run lint# 使用prettier 代码进行格式化# prettier format codepnpm run fmt# testpnpm runtest# 首先要安装nginx镜像# docker nginx deploy# http://localhost:8000# docker-compose up -ddocker compose up -d

src

.├── assets# @/assets/xxx assets source│   ├── FE.png│   └── react.svg├── components# @/components common components│   ├── Auth# auth│   ├── ErrorBoundary# ErrorBoundary│   └── Layout# layout├── constant# @/constant constant├── hooks# @/hooks│   ├── useTheme.ts# theme hooks│   └── redux.ts# redux hooks├── main.tsx# entry├── services# @/services  api├── pages# pages│   ├── error# error page│   ├── home# home page│   ├── login# login page│   └── register# register page├── router.tsx# router tree├── sentry.ts# sentry config├── store# redux store│   ├── index.ts│   └── features# redux state├── styles│   ├── themes# antd theme file│   └── theme.scss├── utils│   ├── Axios.ts# axios│   └── auth.ts└── vite-env.d.ts

Components

Themes

// https://ant.design/docs/react/customize-theme-cn// default.scss:root {--color-primary:#00b96b;// -> colorPrimary: #00b96b--border-radius:4px;// -> borderRadius: 4px}

{"theme" {"tokens": {"dark": {"colorPrimary":"#000","borderRadius":"4px",      },"default": {"colorPrimary":"#00b96b","borderRadius":"4px"      }    },"vars": {"dark":"  --color-primary: #000;  --border-radius: 4px;","default":"  --color-primary: #00b96b; --border-radius: 4px;"    }  }}

<!-- $____theme____$ 是唯一id --><styleid="$____theme____$"data-theme="default">:root {--color-primary:#00b96b;--border-radius:4px;  }</style>

Api

Sentry