Skip to content

SceneryCN/react18ForWebpack5

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Default_Webpack_React_Program

运行

init:yarn

dev mode:yarn run dev:dev

build mode:yarn run build:dev

analy:yarn run build:analy

项目简介

  1. WebPack5
  2. React
  3. Redux-ToolKit
  4. React-Router-Dom
  5. Ts
  6. Axios
  7. Sass [ 推荐 ]
  8. Less [ 不推荐 ]
  9. useWorker
  10. ArcoDesign 已经删除 it has delete

优化配置

  1. 多线程Build
  2. CSS打包抽离
  3. CSS JS压缩
  4. 图片压缩
  5. CSS模块化
  6. 组件按需引入
  7. Proxy代理
  8. Webpack配置分离
  9. Axios请求&响应拦截
  10. 文件更改检测打印

文件介绍

  1. Build

    介绍:Webpack配置

    introduce:webpack config

  2. proxy

    介绍:prosy本地代理

    introduce:crossDomain access config

  3. public

    介绍:初始HTML文件以及icon图片

    introduce:i think you know it

  4. src

    1. api

      介绍:Axios请求存放目录

      introduce:http request

    2. assets

      介绍:音视频图片资源存放目录

      introduce: mp3,mp4,avi,png,jpeg...

    3. Axios

      介绍:Axios配置

      introduce: axios config

    4. components:通用组件目录

      介绍:LazyWrapper.tsx - 组件懒加载

      introduce: currency component

    5. layout

      介绍:可删除layout - 暂时配置不足

      introduce: if you don't use this component can delete it but don't forget delete use it's code

    6. pages

      介绍:页面目录

      introduce: pages

    7. routers

      介绍:路由目录

      introduce: router config

    8. store

      介绍:redux全局状态管理

      introduce: redux global state manager

    9. utils

      介绍:自制轮子

      introduce: some utils of yourself

    10. .browserslistrc

      介绍:浏览器兼容

      introduce: browsers compatibility

    11. App.module.sass

    12. App.tsx

    13. global.d.ts

      介绍:全局类型定义

      introduce: i think you know this

    14. Index.sass

    15. index.tsx

  5. .gitignore

    介绍:git禁传配置

    introduce: i think you know this

  6. babel.config.js

    介绍:babel兼容配置

    introduce: babel config

  7. postcss.config.js

    介绍:postcss配置

    introduce: postcss config

  8. tsconfig.json

    介绍:ts配置

    introduce: ts config

如果你有什么好的建议欢迎提交Issuse

if you has better idea welcome for submit issuse

About

简单的一个webpack5打包的react18模版

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published