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 ...
随机推荐
- Buy A Ticket(图论)
Buy A Ticket 题目大意 每个点有一个点权,每个边有一个边权,求对于每个点u的\(min(2*d(u,v)+val[v])\)(v可以等于u) solution 想到了之前的虚点,方便统计终 ...
- POJ3057 Evacuation 二分图匹配+最短路
POJ3057 Evacuation 二分图匹配+最短路 题目描述 Fires can be disastrous, especially when a fire breaks out in a ro ...
- Java面向对象详解-下
一. static static:静态的,可以用来修饰属性.方法.代码块(或初始化块).内部类 static修饰属性(类变量): 由类创建的所有的对象,都共用这一个属性 当其中一个对象对此属性进行修改 ...
- 文件上传漏洞fuzz字典生成脚本小工具分享
前言 学习xss的时候翻阅资料发现了一个文件上传漏洞fuzz字典生成脚本小工具,试了试还不错,分享一下 配置 需要python2环境 工具地址:https://github.com/c0ny1/upl ...
- 京东秋招提前批初试--java开发工程师
1,自我介绍,学过的课程有哪些 2,介绍一下java的内存结构和内存模型(jvm和jmm) 3,对于NIO有没有了解?作用是什么?(基于通道和缓冲区的I/O方式,用的是DirectByteBuffer ...
- Reface.AppStarter 类型扫描 —— 获得系统中所有的实体类型
类型扫描 是 Reface.AppStarter 提供的最基本.最核心的功能. AutoConfig , ComponentScan 等功能都是基于该功能完成的. 每一个使用 Reface.AppSt ...
- LESS实战::not与:hover混合使用
举个例子,有个HTML是这样的. <div class="item light">A</div> <div class="item" ...
- python和java哪个更值得学?Python会超越Java吗?
Java快死了吗?当然不是.但是Python的普及率每年都在增长.每个都有自己的优点和缺点,并且两者都是值得了解的. 根据IT编程趋势,就工作数量,现有Java开发人员的数量以及IT中的总体使用情况而 ...
- 利用华为eNSP模拟器实现vlan之间的通信
eNSP交换机配置VLAN 1. 搭建网络拓扑结构 运行eNSP>新建拓扑>搭建如下图的拓扑结构>启动设备.利用调色板将划分的vlan进行区分. 2. pc机IP地址配置 pc1的I ...
- 深入理解JVM(一)Java内存区域
运行时数据区 程序计数器 当前线程执行的字节码的行号指示器 每条线程都有独立的程序计数器,各线程之间计数器互不影响,独立存储. 如果执行的是java方法,计数器记录正在执行的虚拟机字节码指令的位置: ...