react-ts模板2.0
最新整理的react模板2.0
- react 16.12.0
- react-router
- redux,redux-thunk
- hooks,typescript
- antd v4,sass, less, dayjs
- lodash,moment,uuid,js-cookie
- suspense,lazy懒加载
- axios antd主题切换
运行和打包
$ npm i
$ npm start
$ npm run build-dev // 测试打包
$ npm run build-prod // 正式打包
$ npm run analyze // 分析打包
$ npm run lint // eslint检查
整合了最新的webpack4,alloy-eslint约束, ant design v4.0.0
目录
|————config --------------------- 启动和打包配置
| |————webpack.config.js
|————eslintRule ----------------- eslint规则
|————scripts -------------------- 启动和打包脚本
| |————build-analyze.js --------- 文件分析
| |————build.js ----------------- 打包
| |————start.js ----------------- 运行
| |————test.js ------------------ 测试
|————src ------------------------
| |————api --------------------- 业务逻辑层
| |————assets ------------------ 全局公用文件
| | |————css ------------------- css
| | |————images ---------------- 图片
| | |————iconfont -------------- 字体等
| |————common ------------------ 全局通用常量
| |————components -------------- 通用组件
| | |————common ---------------- 子组件封装
| | | |————myList.tsx
| | | |————myForm.tsx
| | |————layout ---------------- 布局
| | | |————header.tsx
| |————views ------------------- 业务组件
| | |————settlement ------------- 业务模块
| | | |————Settlement.tsx
| | |————index.tsx -------------- 入口
| |————config ------------------- 全局配置
| | |————routerConfig.tsx ------ 路由配置
| |————redux -------------------- redux
| | |————rootReducer.ts -------- reducer集合
| | |————user.redux.ts --------- state | action | reducer集成 | 按模块划分不同文件
| |————typings ------------------ 接口集合
| |————utils -------------------- 通用工具类
|————.eslintrc.js --------------- eslint自定义
|————.prettierrc.js ------------- prettier
|————README.MD ------------------ 项目描述文件
|————SETTINGS.MD ---------------- 运行配置介绍
alloy-eslint
参考SETTINGS.md
react-ts模板2.0的更多相关文章
- [闲的蛋疼系列]从零开始用TypeScript写React的UI组件(0)-先写一个Button??
0.咸鱼要说的 一入前端深似海,咸鱼入海更加咸. 最近闲的蛋疼,手上年前的事也完成了7788了,借助[PG1]的话来说,我们要keep real. 咸鱼肯定不real 了,因为我们都活在梦里,所以咱们 ...
- react全家桶从0搭建一个完整的react项目(react-router4、redux、redux-saga)
react全家桶从0到1(最新) 本文从零开始,逐步讲解如何用react全家桶搭建一个完整的react项目.文中针对react.webpack.babel.react-route.redux.redu ...
- react+ts封装AntdUI的日期选择框之月份选择器DatePicker.month
需求:由于在项目开发中,当需要使用该组件时都需要对该组件进行大量的代码输出,为了方便代码统一管理,减少冗余代码,所以将此组件进行二次封装. 其他成员在使用中只需将自己的设置通过对应的参数传递到该组件, ...
- typescript使用入门及react+ts实战
ts介绍 TypeScript是一种由微软开发的自由和开源的编程语言.它是 JavaScript 的一个超集,而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程. 与js关系 ts与js区 ...
- 亿能测试白盒安全测试模板V1.0发布
亿能测试白盒安全测试模板V1.0发布http://automationqa.com/forum.php?mod=viewthread&tid=2911&fromuid=21
- React + Ts 实现三子棋小游戏
在这里阅读效果更佳 还记得当年和同桌在草稿纸上下三子棋的时光吗 今天我们就用代码来重温一下年少(假设你有react基础,没有也行,只要你会三大框架的任意一种,上手react不难) 游戏规则 双方各执一 ...
- webpack搭建react+ts+eslint项目
[初始化项目] mkdir react_ts_eslint cd react_ts_eslint npm init [生成ts配置文件] tsc --init [安装相关依赖] npm install ...
- 从零搭建react+ts组件库(封装antd)
为什么会有这样一篇文章?因为网上的教程/示例只说了怎么做,没有系统详细的介绍引入这些依赖.为什么要这样配置,甚至有些文章还是错的!迫于技术洁癖,我希望更多的开发小伙伴能够真正的理解一个项目搭建各个方面 ...
- react native 升级到0.31.0的相关问题 mac Android Studio开发环境
报错Caused by: java.lang.ClassCastException: android.app.Application cannot be cast to com.facebook.re ...
随机推荐
- 升降梯上——玄学dp
升降梯上 题目描述 开启了升降梯的动力之后,探险队员们进入了升降梯运行的那条竖直的隧道,映入眼帘的是一条直通塔顶的轨道.一辆停在轨道底部的电梯.和电梯内一杆控制电梯升降的巨大手柄. \(Nescafe ...
- day56 js收尾,jQuery前戏
目录 一.原生js事件绑定 1 开关灯案例 2 input框获取焦点,失去焦点案例 3 实现展示当前时间,定时功能 4 省市联动 二.jQuery入门 1 jQuery的两种导入方式 1.1 直接下载 ...
- Python List comprehension列表推导式
http://blog.chinaunix.net/uid-28631822-id-3488324.html 具体内容需要进一步学习
- FileBeat yml配置文件 -常用参数详解
#filebeat 5.2.2 #prospector(input)段配置 filebeat.prospectors: #每一个prospectors,起始于一个破折号"-" - ...
- 数据可视化之powerBI基础(三)编辑交互,体验更灵活的PowerBI可视化
https://zhuanlan.zhihu.com/p/64412190 PowerBI可视化与传统图表的一大区别,就是可视化分析是动态的,通过页面上筛选.钻取.突出显示等交互功能,可以快速进行访问 ...
- 01 flask源码剖析之werkzurg 了解wsgi
01 werkzurg了解wsgi 目录 01 werkzurg了解wsgi 1. wsgi 2. flask之werkzurg源码流程 3. 总结 1. wsgi django和flask内部都没有 ...
- CMDB03 /今日未采集的资产、资产入库、资产变更记录、资产采集
CMDB03 /今日未采集的资产.资产入库.资产变更记录.资产采集 目录 CMDB03 /今日未采集的资产.资产入库.资产变更记录.资产采集 1. 获取今日未采集的服务器 2. server资产入库以 ...
- 一文读懂Java中的动态代理
从代理模式说起 回顾前文: 设计模式系列之代理模式(Proxy Pattern) 要读懂动态代理,应从代理模式说起.而实现代理模式,常见有下面两种实现: (1) 代理类关联目标对象,实现目标对象实现的 ...
- Quartz.Net系列(十六):Misfire策略在SimpleScheduler和CronScheduler中的使用
1.场景 ①因为工作线程都在忙碌,所以导致某些Trigger得不到触发 也就是默认10个工作线程而我有15个Trigger同时触发 这就导致有5个不能被触发,而不幸的是Trigger所关联的Job执行 ...
- 时间序列知识图谱-《利用Python进行数据分析》
所有内容整理自<利用Python进行数据分析>,使用MindMaster Pro 7.3制作,emmx格式,源文件已经上传Github,需要的同学转左上角自行下载或者右击保存图片. 其他章 ...