Skip to content

React Automatically - 保持最新技术 react18 hooks router6 webpack5 babel7 antd4

License

Notifications You must be signed in to change notification settings

javaLuo/react-luo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

a551c86 · Nov 14, 2022
Apr 16, 2020
Nov 19, 2020
Nov 14, 2022
Jul 26, 2019
Apr 4, 2022
Jun 16, 2022
Feb 4, 2021
May 29, 2017
Apr 20, 2021
Nov 14, 2022
Oct 18, 2020
Aug 30, 2021
Nov 14, 2022
Feb 5, 2022
Dec 15, 2021

Repository files navigation

React-Luo

Build Status codebeat badge code style: prettier GitHub last commit

what is this?

react automatically
这是一个 React 脚手架,没有使用 create-react-app
标准的 React+Redux 分层结构
经过了多个项目的实践,不停的更新和优化出来的。目前自己做项目也在用。

  • PWA、Hooks、代码分割、热替换、HappyPack 多线程构建、ES6+语法

构建 Start

yarn install		# 安装依赖模块

yarn start		# 运行开发环境: http://localhost:8888
yarn build		# 正式打包,用于生产环境

yarn dist		# 运行正式打包后的最终文件(build目录下的文件): http://localhost:8889
yarn distmac	        # MAC下运行最终文件:http://localhost:8889

yarn prettier		# 自动格式化src、mock目录下的所有.js/.css/.scss/.less文件

更新日志 Update log

Wiki

目录结构 Structure

.
├── build				# 正式打包后,会自动生成该文件夹,其中会包含最终用于生产环境的文件
│   ├── dist				# 编译后的资源文件
│   ├── icons				# 编译后自动生成的各尺寸favicon图标,有的会用于PWA配置
│   ├── asset-manifets.json		# 记录了将会被缓存的资源
│   ├── index.html			# 编译后的主页html
│   ├── manifest.json			# PWA配置文件,配置了桌面图标,以APP方式启动时的启动页面相关参数
│   └── service-worker.js		# PWA核心worker, 用于离线访问,缓存不变的资源文件
├── mock				# mock测试数据
├── public				# 静态文件,index.html等
├── src                                 # 项目代码目录
│   ├── component                     # 所有的公共类UI组件
│   ├── container                     # 所有的页面级容器组件
|	├── ...
|   	└── router			# 根组件,里面配置了顶级的路由
|   ├── models				# 模块(包含store数据/reducers/actions)
│   ├── assets                          # 所有的图片、文件等静态资源
│   ├── styles                          # 所有的样式文件
│   ├── store                           # store数据中心
│   ├── root                            # 根页
│   ├── store                           # store数据中心
│   ├── util                            # 自定义工具
│   ├── index.js                        # 项目入口JS
│   └── index.html                      # 主页html文件,开发环境和生产打包共用
├── server.js				# 用于开发环境的服务部署
├── webpack.dev.config.js		# 用于开发环境的webpack配置
└── webpack.production.config.js	# 用于生产环境正式打包的webpack配置

预览地址 Demo

https://isluo.com/work/pwa/

参阅资料

React 英文官网:https://reactjs.org
React 中文文档:https://doc.react-china.org
React GitHub 地址:https://github.com/facebook/react
React 官方更新日志:https://github.com/facebook/react/releases
React 生命周期:https://reactjs.org/docs/react-component.html
mockjs 官网:http://mockjs.com/
Eslint 中文站:http://eslint.cn/
Babel GitHub 地址:https://github.com/babel/babel