Skip to content

🚀 react模板 react项目模板 React18 React19 + webpack5 + TypeScript5 + mobx6 + react-router-dom6 react 模板 基于react企业级模板 项目模板 简单模板 快速模板

License

Notifications You must be signed in to change notification settings

guokaigdg/react-enterprise-template

Repository files navigation

react 模板



简体中文 | English

🔗 在线 Demo

👨🏻‍💻 项目说明

⚡️ 特性

  • 📦 开箱即用,无需配置
  • 📝 全面注释说明,学习低成本
  • 🚀 启动编译迅速
  • 🌱 极易定制, 拓展容易

🚀 技术栈

react TypeScriptwebpack axios mobx react-router-dom MIT

  • React v18
  • react-dom v18
  • TypeScript v4
  • webpack v5
  • axios v1
  • mobx v6
  • mobx-react-lite v3
  • react-router-dom v6

🎄 陆续更新内容:

⌛️ 安装项目依赖

  • node >= 16.0.0
  • npm >= 7.0.0
  • yarn >= 1.22.17
npm install
yarn
pnpm install

🚀 运行项目

npm
$ npm run start

yarn
$ yarn dev

📦 打包编译

npm run build:qa  // 测试环境
npm run build:prod  // 线上环境

🏷 分支说明

分支 说明
main 主分支
dev 开发分支
deploy demo 部署分支

代码提交规范

git <type>: <subject>
git commit -m “feat: 项目初始化”

type 参考:

fix       🐛 Bug修复
feature   ✨ 引入新特性
docs      📝 文档书写改动
prune     🔥 移除代码或文件
perf      ⚡ 性能相关优化
rocket    🚀 部署功能
style     💄 style修改
init      🎉 初始化提交
release   🔖 发布版本
wip       🚧 正在进行中, 且有可能出现不稳定运行的提交
config    🔧 修改配置文件
refactot  🔨 重构(既不增加新功能, 也不修改bug的代码改动)
merge     🔀 合并分支

📂 目录结构

    ├── .vscode
    │   └──setting.json                 # 先于vscode全局的settings.json配置
    ├── doc                             # 开发文档记录
    ├── webpack                         # 打包编译
    │   └──config                       # webpack配置
    │       ├── webpack.common.js       # 基础配置
    │       ├── webpack.dev.js          # 开发环境配置
    │       └──webpack.prod.js          # 生产环境配置
    ├── pubilc
    │   ├──favicon.ico                  # HTML图标
    │   └──index.html                   # HTML入口模板
    ├── src
    |   ├── api                         # 接口配置
    |   ├── assets                      # 静态资源
    │   ├── components                  # 项目通用通用组件
    │   ├── http                        # 请求统一封装
    │   ├── httpinterface               # ts类型定义
    │   ├── constData                   # 系统内的常量列表
    │   ├── router                      # 统一路由入口
    │   ├── store                       # 数据共享
    │   ├── styles                      # 全局样式
    │   ├── utils                       # 工具库
    │   ├── view                        # 页面
    │   ├── App.tsx                     # 主界面
    │   └──index.tsx                    # 入口文件
    ├── .babelrc.js                     # babel配置
    ├── .editorconfig                   # 跨编辑器维护一致编码风格
    ├── .env.json                       # 环境变量配置
    ├── .eslintignore                   # ESLint忽略检测文件
    ├── .eslintrc.js                    # ESLint配置
    ├── .gitignore                      # git提交忽略文件
    ├── .npmrc
    ├── .prettierignore                 # prettierc忽略文件
    ├── .prettierrc                     # prettierc配置
    ├── .stylelintrc.js                 # 代码风格配置
    ├── LICENSE                         # 开源协议
    ├── package-lock.json               # npm安装包锁定管理
    ├── package.json                    # 依赖包管理
    ├── README.md                       # 项目说明
    ├── tsconfig.json                   # ts配置文件
    └── yarn.lock                       # yarn安装包锁定管理

📚 开发资料参考

🤝 如何贡献

  • 📬 有问题直接 issues 或者留言
  • 🧙‍♀️ 欢迎所有的贡献者,快来 Issus 或 Pull requests 成为贡献者吧

💡 开源协议

该项目的代码和文档基于  MIT License  开源协议。

About

🚀 react模板 react项目模板 React18 React19 + webpack5 + TypeScript5 + mobx6 + react-router-dom6 react 模板 基于react企业级模板 项目模板 简单模板 快速模板

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published