🚀🚀🚀 react-template 使用了最新的React18
、React-Router v6
、React-Hooks
、Vite4
、Zustand
、Typescript
等主流技术开发,集成 Dark Mode
(暗黑)模式,并且持久化保存,集成了代码规范检查工具Eslint
、Prettier
、Stylelint
。你可以在此之上直接开发你的业务代码!希望你能喜欢。👋👋👋
注:如果对您有帮助,您可以点右上角 "Star" 支持一下 谢谢!
- 🚀 采用最新技术栈开发:React18、React-Router v6、React-Hooks、TypeScript、Vite4
- 🚀 采用 Vite4 作为项目开发、打包工具(配置 Gzip 打包、TSX 语法、跨域代理…)
- 🚀 整个项目集成了 TypeScript
- 🚀 使用 Zustand 做状态管理,轻量、简单、易用
- 🚀 使用 Prettier 统一格式化代码,集成 Eslint、Stylelint 代码校验规范(项目规范配置)
- 🚀 使用 husky、lint-staged、commitlint 规范提交信息(项目规范配置)
提前了解和学习这些知识会对使用本项目有很大的帮助。
- React - 熟悉
React
基础语法 - React-Router - 熟悉
React-Router
基本使用 - Zustand - 熟悉
Zustand
基本使用 - Vite - 熟悉
Vite
特性 - TypeScript - 熟悉
TypeScript
基本语法 - Icones - 本项目推荐图标库,当然你也可以使用其他图标库
- Es6+ - 熟悉
ES6
基本语法
本地环境需要安装 pnpm7.x、Node.js 和 Git
如果你使用的 IDE 是vscode(推荐)的话,可以安装以下工具来提高开发效率及代码格式化
- ES7+ React/Redux/React-Native snippets - react 开发必备
- CSS Modules - css 模块化支持
- ESLint - 脚本代码检查
- Prettier - 代码格式化
- Stylelint - css 格式化
# 克隆项目
git clone https://github.com/sankeyangshu/react-template.git
# 进入项目目录
cd react-template
# 安装依赖 - 推荐使用pnpm
pnpm install
# 启动服务
pnpm dev
# 打包发布
pnpm build
你可以提一个 issue 或者提交一个 Pull Request。
Pull Request:
- Fork 代码
- 创建自己的分支:
git checkout -b feat/xxxx
- 提交你的修改:
git commit -am 'feat(function): add xxxxx'
- 推送您的分支:
git push origin feat/xxxx
- 提交
pull request
feat
: 新增功能fix
: 修复 bugdocs
: 文档变更style
: 代码格式(不影响功能,例如空格、分号等格式修正)refactor
: 代码重构(不包括 bug 修复、功能新增)perf
: 性能优化test
: 添加、修改测试用例build
: 构建流程、外部依赖变更(如升级 npm 包、修改 webpack 配置等)ci
: 修改 CI 配置、脚本chore
: 对构建过程或辅助工具和库的更改(不影响源文件、测试用例)revert
: 回滚 commit
- 本地开发推荐使用 Chrome 最新版浏览器 Download。
- 生产环境支持现代浏览器,不在支持 IE 浏览器,更多浏览器可以查看 Can I Use Es Module。
IE |
Edge |
Firefox |
Chrome |
Safari |
---|---|---|---|---|
not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |