pandaoh / react_micro_web

( 迁移 => https://github.com/biugle/web_base )-太极(TaiJi)-基于 React + TypeScript + Vite + Antd + Electron 实现的伪微前端模板(适用于开发大型/复杂项目但又人数较少的情况)

2023.5 迁移至 web_base

---

react_micro_web

太极(TaiJi)-基于 React + TypeScript + Vite + Antd + Electron 实现的伪微前端模板(适用于开发大型/复杂项目但又人数较少的情况)

Technology Stack

• React 17.x
• Redux Toolkit
• TypeScript
• Scss/Less
• Ant Design 4.x
• Vite 3.x
• Electron
• EsLint
• Prettier
• Husky

Use

git clone https://github.com/pandaoh/react_micro_web.git

npm i -g js-xcmd
xcmd create-micro-web [dir]

Start

• npm install or npm run init

Development

• npm run dev or npm run dev:exe

Preview

• npm run server or npm run server:exe

Build

• npm run build or npm run build:exe

Code Check

• npm run lint

Dir Structure Design

目录结构设计

________________________________________________________________________________
├─.helper（项目辅助工具类目录）
|    ├─prod（生产环境工具）
|    ├─dev（开发环境工具）
|    ├─ci_cd（CI/CD 工具）
├─src（源代码目录）
|  ├─main.tsx（主程序）
|  ├─_custom（主程序自定义内容目录：指令、hook、业务通用方法等...）
|  ├─types（主程序类型声明目录）
|  ├─consts（主程序通用常量目录）
|  ├─libs（主程序插件管理目录）
|  ├─tools（主程序通用工具类目录）
|  ├─locales（主程序国际化配置目录）
|  ├─common（全局通用组件目录）
|  ├─layouts（主程序通用布局组件目录）
|  ├─views（主程序页面目录）
|  ├─services（主程序接口服务目录）
|  ├─redux（主程序状态管理目录）
|  ├─router（主程序路由器与配置目录）
|  ├─resource（主程序通用资源目录）
|  ├─configuration（主程序配置管理目录）
|  ├─modules（所有子模块目录）
|  |    ├─ModuleA（模块 ModuleA 目录）
|  |    |    ├─_custom（模块自定义内容目录：指令、hook、业务通用方法等...）
|  |    |    ├─types（模块类型声明目录）
|  |    |    ├─consts（模块通用常量目录）
|  |    |    ├─plugins（模块插件管理目录）
|  |    |    ├─utils（模块通用工具类目录）
|  |    |    ├─lang（模块国际化配置目录）
|  |    |    ├─components（模块通用组件目录）
|  |    |    ├─positions（模块通用布局组件目录）
|  |    |    ├─pages（模块页面目录）
|  |    |    ├─apis（模块接口服务目录）
|  |    |    ├─store（模块状态管理目录）
|  |    |    ├─routes（模块路由器与配置目录）
|  |    |    ├─static（模块通用资源目录）
|  |    |    ├─config（模块配置管理目录）
├─public（项目通用静态资源目录）
├─declare（整体通用声明管理目录）
├─tests（测试管理目录）
├─settings（项目 settings 管理目录）
├─mocks（项目 mocks 管理目录）
├─hooks（项目 hooks 管理目录）
├─electron（集成 electron 代码目录）
├─index.html（首页）
├─tsconfig.json（tsconfig 配置文件）
├─tsconfig.electron.json（electron tsconfig 配置文件）
├─tsconfig.node.json（node tsconfig 配置文件）
├─vite.config.ts（vite 配置文件）
├─.editorconfig（编辑器通用配置文件）
├─.env.electron（electron 开发环境变量）
├─.env.development（开发环境变量）
├─.env.production（生产环境变量）
├─.eslintignore（eslint ignore）
├─.eslintrc.js（eslint config）
├─.prettierignore（prettier ignore）
├─.prettierrc.js（prettier config）
├─.gitignore（git ignore）
├─package.json（package.json）
├─README.md（介绍文档）
▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔

Docs

• React
• Redux Toolkit
• Vite
• Ant Design
• Ant Design ProComponents

Others

• Issue
• Pull Request
• [e-mail]
• Blog
• Leo He

Buy me a coffee!