Skip to content

Commit c4ce6a3

Browse files
committed
chang react admin template to ts
0 parents  commit c4ce6a3

File tree

116 files changed

+10442
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

116 files changed

+10442
-0
lines changed

.editorconfig

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
# https://editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset = utf-8
6+
indent_style = space
7+
indent_size = 2
8+
end_of_line = lf
9+
insert_final_newline = true
10+
trim_trailing_whitespace = true
11+
12+
[*.md]
13+
insert_final_newline = false
14+
trim_trailing_whitespace = false

.env.build

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
VITE_APP_ENV='build'
2+
VITE_APP_BASE_URL='http://8.135.1.141/micro-service-api'

.env.serve-dev

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
VITE_APP_ENV='serve'
2+
VITE_APP_BASE_URL='http://8.135.1.141/micro-service-api'

.env.serve.prod

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
REACT_APP_BASE_URL=https://xxxxx
2+
REACT_APP_BASE_URL2=https://xxxxx
3+
REACT_APP_ENV=prod

.eslintignore

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
public
2+
node_modules
3+
.history
4+
.husky
5+
dist
6+
*.d.ts

.eslintrc.js

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
module.exports = {
2+
env: {
3+
browser: true,
4+
commonjs: true,
5+
es6: true
6+
},
7+
extends: ['prettier'],
8+
globals: {
9+
process: true,
10+
__dirname: true,
11+
document: true,
12+
localStorage: true,
13+
window: true,
14+
defineProps: true,
15+
defineEmits: true,
16+
defineExpose: true,
17+
ObjTy: true,
18+
axiosConfigTy: true
19+
},
20+
parser: '@typescript-eslint/parser',
21+
parserOptions: {
22+
ecmaFeatures: {
23+
experimentalObjectRestSpread: true,
24+
jsx: true
25+
},
26+
sourceType: 'module',
27+
ecmaVersion: 7
28+
},
29+
plugins: ['react'],
30+
rules: {
31+
//quotes: [2, 'single'], //单引号
32+
'no-console': 0, //不禁用console
33+
'no-debugger': 2, //禁用debugger
34+
'no-var': 0, //对var警告
35+
'no-irregular-whitespace': 0, //不规则的空白不允许
36+
'no-trailing-spaces': 1, //一行结束后面有空格就发出警告
37+
'eol-last': 0, //文件以单一的换行符结束
38+
'no-unused-vars': 1,
39+
//'no-unused-vars': [2, { vars: 'all', args: 'after-used' }], //不能有声明后未被使用的变量或参数
40+
'no-underscore-dangle': 0, //标识符不能以_开头或结尾
41+
'no-alert': 2, //禁止使用alert confirm prompt
42+
'no-lone-blocks': 0, //禁止不必要的嵌套块
43+
'no-class-assign': 2, //禁止给类赋值
44+
'no-cond-assign': 2, //禁止在条件表达式中使用赋值语句
45+
'no-const-assign': 2, //禁止修改const声明的变量
46+
'no-delete-var': 2, //不能对var声明的变量使用delete操作符
47+
'no-dupe-keys': 2, //在创建对象字面量时不允许键重复
48+
'no-duplicate-case': 2, //switch中的case标签不能重复
49+
'no-dupe-args': 2, //函数参数不能重复
50+
'no-empty': 2, //块语句中的内容不能为空
51+
'no-func-assign': 2, //禁止重复的函数声明
52+
'no-invalid-this': 0, //禁止无效的this,只能用在构造器,类,对象字面量
53+
'no-redeclare': 2, //禁止重复声明变量
54+
'no-spaced-func': 2, //函数调用时 函数名与()之间不能有空格
55+
'no-this-before-super': 0, //在调用super()之前不能使用this或super
56+
'no-undef': 2, //不能有未定义的变量
57+
//'no-use-before-define': 1, //未定义前不能使用
58+
'jsx-quotes': [2, 'prefer-double'], //强制在JSX属性(jsx-quotes)中一致使用双引号
59+
'react/display-name': 0, //防止在React组件定义中丢失displayName
60+
'react/forbid-prop-types': [2, { forbid: ['any'] }], //禁止某些propTypes
61+
//'react/jsx-boolean-value': 2, //在JSX中强制布尔属性符号
62+
'react/jsx-closing-bracket-location': 1, //在JSX中验证右括号位置
63+
'react/jsx-curly-spacing': [2, { when: 'never', children: true }], //在JSX属性和表达式中加强或禁止大括号内的空格。
64+
//'react/jsx-indent-props': [2, 4], //验证JSX中的props缩进
65+
'react/jsx-key': 2, //在数组或迭代器中验证JSX具有key属性
66+
//'react/jsx-max-props-per-line': [1, { maximum: 1 }], // 限制JSX中单行上的props的最大数量
67+
'react/jsx-no-bind': 0, //JSX中不允许使用箭头函数和bind
68+
'react/jsx-no-duplicate-props': 2, //防止在JSX中重复的props
69+
'react/jsx-no-literals': 0, //防止使用未包装的JSX字符串
70+
'react/jsx-no-undef': 1, //在JSX中禁止未声明的变量
71+
'react/jsx-pascal-case': 0, //为用户定义的JSX组件强制使用PascalCase
72+
//'react/jsx-sort-props': 2, //强化props按字母排序
73+
'react/jsx-uses-react': 1, //防止反应被错误地标记为未使用
74+
'react/jsx-uses-vars': 2, //防止在JSX中使用的变量被错误地标记为未使用
75+
'react/no-danger': 0, //防止使用危险的JSX属性
76+
'react/no-did-mount-set-state': 0, //防止在componentDidMount中使用setState
77+
'react/no-did-update-set-state': 1, //防止在componentDidUpdate中使用setState
78+
'react/no-direct-mutation-state': 2, //防止this.state的直接变异
79+
'react/no-multi-comp': 2, //防止每个文件有多个组件定义
80+
'react/no-set-state': 0, //防止使用setState
81+
'react/no-unknown-property': 2, //防止使用未知的DOM属性
82+
'react/prefer-es6-class': 2, //为React组件强制执行ES5或ES6类
83+
'react/prop-types': 0, //防止在React组件定义中丢失props验证
84+
'react/react-in-jsx-scope': 2, //使用JSX时防止丢失React
85+
'react/self-closing-comp': 0, //防止没有children的组件的额外结束标签
86+
'react/sort-comp': 2, //强制组件方法顺序
87+
'no-extra-boolean-cast': 0, //禁止不必要的bool转换
88+
'react/no-array-index-key': 0, //防止在数组中遍历中使用数组key做索引
89+
'react/no-deprecated': 1, //不使用弃用的方法
90+
'react/jsx-equals-spacing': 2, //在JSX属性中强制或禁止等号周围的空格
91+
'no-unreachable': 1, //不能有无法执行的代码
92+
'comma-dangle': 2, //对象字面量项尾不能有逗号
93+
'no-mixed-spaces-and-tabs': 0, //禁止混用tab和空格
94+
'prefer-arrow-callback': 0, //比较喜欢箭头回调
95+
'arrow-parens': 0, //箭头函数用小括号括起来
96+
'arrow-spacing': 0 //=>的前/后括号
97+
},
98+
settings: {
99+
'import/ignore': ['node_modules']
100+
}
101+
}

.gitignore

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
.history
2+
.idea
3+
node_modules
4+
.DS_Store
5+
dist
6+
dist-ssr
7+
*.local
8+
yarn.lock

.prettierrc

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"useTabs": false,
3+
"tabWidth": 2,
4+
"printWidth": 120,
5+
"singleQuote": true,
6+
"trailingComma": "none",
7+
"bracketSpacing": true,
8+
"semi": false,
9+
"htmlWhitespaceSensitivity": "ignore"
10+
}

LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2021-present kuanghua
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README-zh_CN.md

Lines changed: 207 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,207 @@
1+
# react-admin-ts
2+
3+
**中文** | [English](./README.md)
4+
5+
6+
7+
> 这是一个基础的 react admin 管理后台。
8+
9+
10+
本架构使用的技术为:react17+vite2+ant4 新一代的前端框架,It's fast!
11+
12+
使用 eslint+prettier+gitHooks 格式和校验代码,提高代码规范性和开发效率
13+
14+
## 更新日志
15+
16+
```javascript
17+
//10-08
18+
add error log collection func
19+
```
20+
21+
22+
## 线上体验
23+
24+
[github address](https://github.com/jzfai/react-admin-ts.git)
25+
26+
[Access address](http://8.135.1.141/react-admin-ts)
27+
28+
github 地址: https://github.com/jzfai/react-admin-ts.git
29+
30+
国内体验地址:http://8.135.1.141/react-admin-ts
31+
32+
33+
## 例子
34+
35+
---- 我们先看看加载速度和构建后的包大小:
36+
37+
![template-speed-analysis](http://8.135.1.141/file/images/react-template-speed-analysis.png)
38+
39+
![template-demo](http://8.135.1.141/file/images/react-template-demo.png)
40+
41+
## 相关项目
42+
43+
框架有js,ts和plus版本
44+
45+
- js版本:[vue3-element-admin](https://github.com/jzfai/vue3-admin-template.git)
46+
- ts版本:[vue3-element-ts](https://github.com/jzfai/vue3-admin-ts.git)
47+
- js实例参考plus版本:[vue3-element-plus](https://github.com/jzfai/vue3-admin-plus.git)
48+
- react版本: [react-admin-template](https://github.com/jzfai/react-admin-template.git)
49+
- java微服务后台数据:[micro-service-plus](https://github.com/jzfai/micro-service-plus)
50+
51+
> 开发和使用感受:两个字 真香!!!!!
52+
53+
54+
## 文档
55+
-- 文档努力开发中。。。。
56+
57+
可以先参考(和vue-admin-template使用类似):[vue-admin-template使用文档](https://juejin.im/post/59097cd7a22b9d0065fb61d2)
58+
59+
60+
#### 和 传统react admin区别
61+
62+
1.路由配置简单,一次配置即可完成路由生成和页面渲染
63+
64+
2.采用 react hooks ,写法更加灵活,简单,更易维护和迁移
65+
66+
3.使用vite2代替webpack 配置更加简单,打包和运行速度更快
67+
68+
69+
[vite2和webpack打包速度上的对比](https://github.com/jzfai/vue3-admin-template/issues/2)
70+
71+
## 构建步骤
72+
73+
```bash
74+
# 克隆项目
75+
git clone https://github.com/jzfai/react-admin-ts.git
76+
77+
# 进入项目目录
78+
cd react-admin-ts
79+
80+
# 安装依赖(建议用yarn)
81+
yarn
82+
83+
# 启动服务
84+
yarn run dev
85+
```
86+
87+
浏览器访问 http://localhost:5005
88+
89+
90+
## 发布
91+
92+
```bash
93+
# 构建测试环境
94+
yarn run build-serve
95+
96+
# 构建生产环境
97+
yarn run build
98+
```
99+
100+
## 其它
101+
102+
```bash
103+
# 预览发布环境效果
104+
yarn run preview:build-serve
105+
106+
# 预览生产环境
107+
yarn run preview
108+
109+
# 代码格式检查并自动修复
110+
yarn run lint
111+
```
112+
113+
## 功能
114+
115+
```
116+
- 登录 / 注销
117+
118+
- 权限验证
119+
- 页面权限
120+
- 指令权限
121+
- 权限配置
122+
- 二步登录
123+
124+
- 多环境发布
125+
- serve
126+
- build
127+
- priview
128+
- lint
129+
130+
- 全局功能
131+
#- 国际化多语言
132+
#- 多种动态换肤
133+
- 动态侧边栏(支持多级路由嵌套)
134+
- 动态面包屑
135+
- 快捷导航(标签页)
136+
- Svg Sprite 图标
137+
- 本地/后端 mock 数据
138+
#- Screenfull全屏
139+
- 自适应收缩侧边栏
140+
141+
- 编辑器
142+
#- 富文本
143+
#- Markdown
144+
#- JSON 等多格式
145+
146+
#- Excel
147+
#- 导出excel
148+
#- 导入excel
149+
#- 前端可视化excel
150+
#- 导出zip
151+
152+
- 表格
153+
#- 动态表格
154+
#- 拖拽表格
155+
#- 内联编辑
156+
157+
- 错误页面
158+
#- 401
159+
#- 404
160+
161+
- 組件
162+
- 头像上传
163+
- 返回顶部
164+
#- 拖拽Dialog
165+
#- 拖拽Select
166+
#- 拖拽看板
167+
#- 列表拖拽
168+
#- SplitPane
169+
#- Dropzone
170+
#- Sticky
171+
#- CountTo
172+
173+
- 综合实例
174+
- 错误日志
175+
- Dashboard
176+
#- 引导页
177+
- ECharts 图表
178+
#- Clipboard(剪贴复制)
179+
#- Markdown2html
180+
```
181+
182+
>注:#---暂未实现(希望大家能一起开发)
183+
184+
## 额外
185+
186+
架构开发不易,如果感觉好,请给我点个赞憋,架构还在不断完善中,欢迎加入我开发,一起成为Contributors !!!!
187+
188+
## 浏览器支持
189+
190+
191+
Modern browsers and Internet Explorer 11+.
192+
193+
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
194+
| --------- | --------- | --------- | --------- |
195+
|Edge| last 2 versions| last 2 versions| last 2 versions
196+
197+
## 讨论和交流(含react17+ts视频教程)
198+
[WeChat group](http://8.135.1.141/file/images/wx-groud.png)
199+
200+
## 版本
201+
202+
[MIT](https://github.com/jzfai/react-admin-ts/blob/master/LICENSE) license.
203+
204+
Copyright (c) 2021-present kuanghua
205+
206+
207+

0 commit comments

Comments
 (0)