# gatt-react

**Repository Path**: front-learn/gatt-react

## Basic Information

- **Project Name**: gatt-react
- **Description**: 甘特图 react重构版本待完成
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-11-02
- **Last Updated**: 2022-11-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<!--
 * @Author: shawnxiao
 * @Date: 2021-04-05 13:31:59
 * @LastEditTime: 2021-05-11 18:02:08
 * @FilePath: /project/README.md
-->
#### webpack5 + ts 脚手架

> Introduction

- 利用缓存多进程打包
- 最新 webpack5 版本
- 基于 typescript
- 支持多入口多页面
- 热更新，局部更新，代理，代码压缩
- 多进程格式化
- 自定义环境变量
- 自定义主题色
- 自定义打包进度及友好界面
- 放弃了dll,意义不大

> 技术栈 version
- webpack-cli: ^4.6.0,
- webpack-dev-server: ^3.11.2,
- webpackbar: ^5.0.0-3,
- workbox-webpack-plugin: ^6.1.2,
- yargs-parser: ^20.2.7
- antd: ^4.15.0,
- axios: ^0.21.1,
- classnames: ^2.3.1,
- js-cookie: ^2.2.1,
- normalize.css: ^8.0.1,
- react: ^17.0.2,
- react-dom: ^17.0.2,
- react-helmet: ^6.1.0,
- react-redux: ^7.2.3,
- react-router-dom: ^5.2.0,
- react-transition-group: ^4.4.1,
- redux: ^4.0.5,
- redux-logger: ^3.0.6,
- redux-thunk: ^2.3.0
- husky: ^6.0.0,
- less: ^4.1.1,
- less-loader: ^8.0.0,
- lint-staged: ^10.5.4,
- prettier: ^2.2.1,
- typescript: ^4.2.3,
- url-loader: ^4.1.1,
- react-hot-loader: ^4.13.0,
- sass-loader: ^11.0.1,
- style-loader: ^2.0.0,
- stylelint: ^13.12.0,
- stylelint-config-prettier: ^8.0.2,
- stylelint-config-standard: ^21.0.0,
- stylelint-order: ^4.1.0,
- terser-webpack-plugin: ^5.1.1,

#### 代码基础架构说明
> 注意less less-loader版本
```
|-- 根目录
    |-- dist 项目 build 之后的文件夹
    |-- docs 文档生成的根目录位置
    |-- public 项目静态资源，不经过 webpack，以及默认的模版，适合存放第三方压缩好的资源
    |-- mock mock数据文件夹
    | |-- index index页面下的mock数据文件
    | |-- mobile mobile页面下的mock数据文件
    |-- src 主要的开发目录
    | |-- assets 公共静态资源文件夹
    | |-- common 公共工具库文件夹
    | |-- components 公共组件文件夹
    | |-- index index页面文件夹
    | | |-- App.vue 页面渲染根节点
    | | |-- main.js 入口文件
    | | |-- apis http 请求相关
    | | | |-- apiList.ts api 接口列表
    | | | |-- user.ts api 请求模块
    | | |-- assets 存放静态资源，这个文件夹下的文件会走 webpack 压缩流程
    | | | |-- images 图片资源
    | | | |-- svg svg图片资源
    | | | |-- fonts 字体资源
    | | | |-- styles 该单页全局样式，一句 ui 库主题样式
    | | | | |-- \_variables.less
    | | | | |-- test.less
    | | |-- components
    | | | |-- index.ts 自动注册脚本
    | | | |-- global 自动注册的全局组件
    | | | |-- ...其他非全局注册的模块
    | | |-- config 全局静态配置，不可更改项
    | | |-- Layout 页面骨架
    | | |-- plugins 存放第三方插件
    | | | |-- index.ts 插件挂载入口
    | | |-- router 路由
    | | | |-- index.ts 路由入口
    | | | |-- config.ts 路由配置文件
    | | |-- store vuex
    | | | |-- app app模块
    | | | |-- index.ts 自动装载模块
    | | | |-- reducer 模块所有的reducer
    | | | |-- types 模块类型声明
    | | |-- utils 常用函数以及其他有用工具
    | | | |-- common.ts
    | | |-- views 页面级组件
    | | |-- Home.vue 正常页面
    | | |-- test 组件测试页面
    | | |-- Test.vue

    | | |-- mobile index页面文件夹
    |-- .editorconfig vscode 编辑器 设置
    |-- .env.development 开发环境配置
    |-- .env.preview 测试环境配置
    |-- .env.production 生产环境配置
    |-- .eslintignore eslint 要忽略的文件夹
    |-- .eslintrc.js eslint 规则配置
    |-- .gitignore git 忽略的文件
    |-- README.md 项目说明
    |-- package.json npm 配置
    |-- vue.config.js vue-cli 脚手架配置文件
```