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 ...
随机推荐
- 「疫期集训day12」阴雨
我们走进了泥泞的雨林----阿尔贡森林里艰难前进的士兵 今天考试一般,T1T2签到题没啥好说的,剩下三个小时全肛T3(我脑子有泡,前几天刚做了一道类似T4的难题,公式更难推),9:00->10: ...
- 顺时针打印矩阵(剑指offer-19)
题目描述 输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下4 X 4矩阵: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则依次打印出数 ...
- Bash的特性
Bash的特性 1. tab补全 #命令补全 [root@clf ~]# user #命令补全useradd userdel usermod usernetctl user ...
- javascript基础(二): 操作BOM对象(重点)
浏览器介绍 javascript和浏览器关系?BOM:浏览器对象模型 IE6~11 Chrome Safari FireFox Opera 三方 QQ浏览器 360浏览器 window window代 ...
- css 实现动态二级菜单
动态实现简单的二级菜单 当鼠标放到一级标签上时,鼠标会变成小手的形状 展示二级菜单,源码如下,复制即可直接使用 <!DOCTYPE html> <html lang="en ...
- Go的100天之旅-常量
常量 简介 道可道,非常道.这里常道指的永恒不变的道理,常有不变的意思.顾名思义和变量相比,常量在声明之后就不可改变,它的值是在编译期间就确定的. 下面简单的声明一个常量: const p int = ...
- (6)webpack使用babel插件的使用
为什么要使用babel插件? 首先要了解babel插件是干嘛的,随着js的语法规范发展,出现了越来越多的高级语法,但是使用webpack打包的时候,webpack并不能全部理解这些高级语法,需要我们使 ...
- P1866 编号
大致题意: 求太郎的n只兔子的编号的排列种数 基本思路: 每只兔子都有一个范围,那么每只兔子的范围就是这只兔子选择编号的种数. 以5 8为例,第一只兔子有5种,第二只兔子有8种,而第一只兔子选择后,第 ...
- echarts 实战 : 标题的富文本样式
官方文档在这一块交待的不是很清楚,记录一下. title:{ left:15, top:10, subtext:"AAA {yellow|316} BBB {blue|219}", ...
- 带你理解Lock锁原理
同样是锁,先说说synchronized和lock的区别: synchronized是java关键字,是用c++实现的:而lock是用java类,用java可以实现 synchronized可以锁住代 ...