mirror of
https://github.com/zuiidea/antd-admin
synced 2026-10-30 05:13:43 +00:00
📝 Update docs.
This commit is contained in:
zuiidea
@@ -1,3 +1,8 @@
|
||||
<p align="center">
|
||||
<a href="http://github.com/zuiidea/antd-admin">
|
||||
<img alt="antd-admin" height="64" src="./_media/logo.svg">
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<h1 align="center">AntD Admin</h1>
|
||||
|
||||
|
||||
+1
-2
@@ -4,5 +4,4 @@
|
||||
- [Configuration](configuration.md)
|
||||
- Guide
|
||||
- [Deploy](deploy.md)
|
||||
- Changelog
|
||||
- 5.0.0
|
||||
- [Change Log](change-log.md)
|
||||
|
||||
@@ -0,0 +1,50 @@
|
||||
## 5.0.0
|
||||
|
||||
#### Optimization
|
||||
|
||||
- Try to use decorators to simplify code writing and improve code readability.
|
||||
|
||||
- API configurization to simplify the way data is obtained.
|
||||
|
||||
- The files in `utils` are split and each has its own role.
|
||||
|
||||
- Simplify the `utils/request` file without special handling.
|
||||
|
||||
#### Specification
|
||||
|
||||
- Functions add comments, parameters, return values, etc., ambiguous code adds comments, canonical reference [Google JavaScript Style Guide](https://google.github.io/styleguide/jsguide.html#appendices-jsdoc-tag-reference).
|
||||
|
||||
- Semantic version number, specification participation [semantic version 2.0.0](https://semver.org/lang/zh-CN/).
|
||||
|
||||
- Static code checking, unified code style, will use `prettier`, `stylelint`, `eslint` specification code before code submission.
|
||||
|
||||
- Git submits information normalization, [git-commit-emoji-cn](https://github.com/liuchengxu/git-commit-emoji-cn).
|
||||
|
||||
- Based on the pre-defined routing of `Umi`, there is no need to write a routing configuration file.
|
||||
|
||||
- Use `React 16` new features such as `Fragment`, `Context`, `PureComponent`, etc.
|
||||
|
||||
#### Features
|
||||
|
||||
- Support internationalization, extract source fields from source code, load language packs on demand, and automatically translate online.
|
||||
|
||||
- Support for the introduction of `ant-design-pro` components, `lodash` functions on demand.
|
||||
|
||||
- Support multiple layouts, which rules can be used according to the rules.
|
||||
|
||||
- Support Antd Admin to automatically compile and deploy on Travis.
|
||||
|
||||
- Generate a documentation website using `Docsify`.
|
||||
|
||||
|
||||
#### Style
|
||||
|
||||
- Added Antd Admin standalone Logo.
|
||||
|
||||
- Rewrite the overall layout component, optimize the menu, automatic breadcrumb navigation, menu auto-expansion and other logic.
|
||||
|
||||
- The mobile menu is changed to drawer.
|
||||
|
||||
#### Other
|
||||
|
||||
- Discard components such as `IconFont`, `Search`, `DataTable` because they are well supported and replaceable in `Antd`.
|
||||
+111
@@ -0,0 +1,111 @@
|
||||
# Deploy
|
||||
|
||||
After the development is completed and verified in the development environment, it needs to be deployed to our users.
|
||||
|
||||
## Build
|
||||
|
||||
First execute the following command,
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
After a few seconds, the output should look like this：
|
||||
|
||||
```bash
|
||||
> antd-admin@5.0.0-beta build /Users/zuiidea/web/antd-admin
|
||||
> umi build
|
||||
|
||||
[21:13:17] webpack compiled in 43s 868ms
|
||||
DONE Compiled successfully in 43877ms 21:13:17
|
||||
|
||||
File sizes after gzip:
|
||||
|
||||
1.3 MB dist/vendors.async.js
|
||||
308.21 KB dist/umi.js
|
||||
45.49 KB dist/vendors.chunk.css
|
||||
36.08 KB dist/p__chart__highCharts__index.async.js
|
||||
33.53 KB dist/p__user__index.async.js
|
||||
22.36 KB dist/p__chart__ECharts__index.async.js
|
||||
4.21 KB dist/p__dashboard__index.async.js
|
||||
4.06 KB dist/umi.css
|
||||
...
|
||||
```
|
||||
|
||||
The `build` command will package all resources, including JavaScript, CSS, web fonts, images, html, and more. You can find these files in the `dist/` directory.
|
||||
|
||||
> If you have requirements for using HashHistory , deploying html to non-root directories, statics, etc., check out [Umi Deployment] (https://umijs.org/en/guide/deploy.html).
|
||||
|
||||
## Local verification
|
||||
|
||||
|
||||
Local verification can be done via `serve` before publishing.
|
||||
|
||||
```
|
||||
$ yarn global add serve
|
||||
$ serve ./dist
|
||||
|
||||
Serving!
|
||||
|
||||
- Local: http://localhost:5000
|
||||
- On Your Network: http://{Your IP}:5000
|
||||
|
||||
Copied local address to clipboard!
|
||||
|
||||
```
|
||||
|
||||
Access [http://localhost:5000](http://localhost:5000), under normal circumstances, it should be consistent with `npm start` (The API may not get the correct data).
|
||||
|
||||
|
||||
## Deploy
|
||||
|
||||
Next, we can upload the static file to the server. If you use Nginx as the Web server, you can configure it in `ngnix.conf`:
|
||||
```
|
||||
server
|
||||
{
|
||||
listen 80;
|
||||
# Specify an accessible domain name
|
||||
server_name antd-admin.zuiidea.com;
|
||||
# The directory where the compiled files are stored
|
||||
root /home/www/antd-admin/dist;
|
||||
|
||||
# Proxy server interface to avoid cross-domain
|
||||
location /api {
|
||||
proxy_pass http://localhost:7000/api;
|
||||
}
|
||||
|
||||
Because the front end uses BrowserHistory, it will route backback to index.html
|
||||
location / {
|
||||
index index.html;
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Restart the web server and access [http://antd-admin.zuiidea.com](http://antd-admin.zuiidea.com) , You will see the correct page.
|
||||
|
||||
```bash
|
||||
nginx -s reload
|
||||
```
|
||||
|
||||
Similarly, if you use Caddy as a web server, you can do this in `Caddyfile`:
|
||||
|
||||
```
|
||||
antd-admin.zuiidea.com {
|
||||
gzip
|
||||
root /home/www/antd-admin/dist
|
||||
proxy /api http://localhost:7000
|
||||
|
||||
rewrite {
|
||||
if {path} not_match ^/api
|
||||
to {path} {path}/ /
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
antd-admin.zuiidea.com/public {
|
||||
gzip
|
||||
root /home/www/antd-admin/dist/static/public
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
+2
-3
@@ -8,7 +8,7 @@
|
||||
<meta name="description" content="An admin dashboard application demo built upon Ant Design and UmiJS">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css">
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<link rel="icon" href="/_media/favicon.ico" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@@ -38,8 +38,7 @@
|
||||
'/zh-cn/': '找不到结果',
|
||||
'/': 'No Results'
|
||||
}
|
||||
},
|
||||
// homepage: 'https://raw.githubusercontent.com/zuiidea/antd-admin/master/README.md'
|
||||
}
|
||||
}
|
||||
|
||||
// if (typeof navigator.serviceWorker !== 'undefined') {
|
||||
|
||||
@@ -1,3 +1,8 @@
|
||||
<p align="center">
|
||||
<a href="http://github.com/zuiidea/antd-admin">
|
||||
<img alt="antd-admin" height="64" src="../_media/logo.svg">
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<h1 align="center">AntD Admin</h1>
|
||||
|
||||
|
||||
@@ -4,5 +4,4 @@
|
||||
- [配置项](zh-cn/configuration.md)
|
||||
- 指南
|
||||
- [部署](zh-cn/deploy.md)
|
||||
- 更新日志
|
||||
- 5.0.0
|
||||
- [更新日志](zh-cn/change-log.md)
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
## 5.0.0
|
||||
|
||||
#### 优化
|
||||
|
||||
- 尽量使用修饰器，简化代码编写，提高代码可读性。
|
||||
|
||||
- API 配置化，简化获取数据方式。
|
||||
|
||||
- `utils` 内文件拆分，各司其职。
|
||||
|
||||
- 简化`utils/request`文件，不做特殊处理。
|
||||
|
||||
#### 规范
|
||||
|
||||
- 函数添加描述、参数、返回值等注释，含糊不清的代码增加注释，规范参考 [Google JavaScript Style Guide](https://google.github.io/styleguide/jsguide.html#appendices-jsdoc-tag-reference)。
|
||||
|
||||
- 语义化版本号，规范参加 [语义化版本 2.0.0](https://semver.org/lang/zh-CN/)。
|
||||
|
||||
- 静态代码检查，统一代码风格，代码提交前将会使用 `prettier`、`stylelint`、`eslint` 规范代码。
|
||||
|
||||
- Git 提交信息规范化，[git-commit-emoji-cn](https://github.com/liuchengxu/git-commit-emoji-cn)。
|
||||
|
||||
- 基于 `Umi` 的约定式路由，无需再写路由配置文件。
|
||||
|
||||
- 使用 `React 16` 新特性，如 `Fragment`、`Context`、 `PureComponent`等。
|
||||
|
||||
#### 功能
|
||||
|
||||
- 支持国际化，源码中抽离翻译字段，按需加载语言包，自动在线翻译。
|
||||
|
||||
- 支持按需引入 `ant-design-pro` 组件、`lodash` 函数。
|
||||
|
||||
- 支持多布局，可根据规则规定哪些路由使用哪种布局。
|
||||
|
||||
- 支持 Antd Admin 在 Travis 上自动编译和部署。
|
||||
|
||||
- 使用 `Docsify` 生成文档网站。
|
||||
|
||||
|
||||
#### 样式
|
||||
|
||||
- 新增 Antd Admin 独立 Logo。
|
||||
|
||||
- 重写整体布局组件，优化菜单、面包屑导航自动高亮，菜单自动展开等逻辑。
|
||||
|
||||
- 移动端菜单更改为抽屉式。
|
||||
|
||||
#### 其他
|
||||
|
||||
- 废弃 `IconFont`、 `Search`、`DataTable`等组件，因为在 `Antd` 中有很好的支持和可替代的。
|
||||
|
||||
|
||||
+104
-3
@@ -1,11 +1,112 @@
|
||||
# 部署
|
||||
|
||||
## 本地开发
|
||||
完成开发并且在开发环境验证之后，就需要部署给我们的用户了。
|
||||
|
||||
1. 静态文件编译
|
||||
## 构建
|
||||
|
||||
先执行下面的命令，
|
||||
|
||||
```bash
|
||||
npm run trans #可选，提取翻译字段，并自动翻译
|
||||
npm run build
|
||||
```
|
||||
|
||||
几秒后，输出应该如下：
|
||||
|
||||
```bash
|
||||
> antd-admin@5.0.0-beta build /Users/zuiidea/web/antd-admin
|
||||
> umi build
|
||||
|
||||
[21:13:17] webpack compiled in 43s 868ms
|
||||
DONE Compiled successfully in 43877ms 21:13:17
|
||||
|
||||
File sizes after gzip:
|
||||
|
||||
1.3 MB dist/vendors.async.js
|
||||
308.21 KB dist/umi.js
|
||||
45.49 KB dist/vendors.chunk.css
|
||||
36.08 KB dist/p__chart__highCharts__index.async.js
|
||||
33.53 KB dist/p__user__index.async.js
|
||||
22.36 KB dist/p__chart__ECharts__index.async.js
|
||||
4.21 KB dist/p__dashboard__index.async.js
|
||||
4.06 KB dist/umi.css
|
||||
...
|
||||
```
|
||||
|
||||
`build` 命令会打包所有的资源，包含 JavaScript, CSS, web fonts, images, html 等。你可以在 `dist/` 目录下找到这些文件。
|
||||
|
||||
> 如果 有使用 HashHistory 、 部署 html 到非根目录、静态化等需求，请查看[Umi 部署](https://umijs.org/zh/guide/deploy.html)。
|
||||
|
||||
## 本地验证
|
||||
|
||||
|
||||
发布之前，可以通过 `serve` 做本地验证，
|
||||
|
||||
```
|
||||
$ yarn global add serve
|
||||
$ serve ./dist
|
||||
|
||||
Serving!
|
||||
|
||||
- Local: http://localhost:5000
|
||||
- On Your Network: http://{Your IP}:5000
|
||||
|
||||
Copied local address to clipboard!
|
||||
|
||||
```
|
||||
|
||||
访问 [http://localhost:5000](http://localhost:5000)，正常情况下法应该是和 `npm start` 一致的（接口可能无法获取到正确数据）。
|
||||
|
||||
|
||||
## 部署
|
||||
|
||||
接下来，我们可以把静态文件上传到服务器，如果使用 Nginx 作为 Web server，你可以在 `ngnix.conf` 中这样配置：
|
||||
|
||||
```
|
||||
server
|
||||
{
|
||||
listen 80;
|
||||
# 指定可访问的域名
|
||||
server_name antd-admin.zuiidea.com;
|
||||
# 编译后的文件存放的目录
|
||||
root /home/www/antd-admin/dist;
|
||||
|
||||
# 代理服务端接口，避免跨域
|
||||
location /api {
|
||||
proxy_pass http://localhost:7000/api;
|
||||
}
|
||||
|
||||
# 因为前端使用了BrowserHistory，所以将路由 fallback 到 index.html
|
||||
location / {
|
||||
index index.html;
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
重启 Web server，访问 [http://antd-admin.zuiidea.com](http://antd-admin.zuiidea.com) ，你将看到正确的页面。
|
||||
|
||||
```bash
|
||||
nginx -s reload
|
||||
```
|
||||
|
||||
类似的，如果你使用 Caddy 作为 Web server，你可以在 `Caddyfile` 中这样配置：
|
||||
|
||||
```
|
||||
antd-admin.zuiidea.com {
|
||||
gzip
|
||||
root /home/www/antd-admin/dist
|
||||
proxy /api http://localhost:7000
|
||||
|
||||
rewrite {
|
||||
if {path} not_match ^/api
|
||||
to {path} {path}/ /
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
antd-admin.zuiidea.com/public {
|
||||
gzip
|
||||
root /home/www/antd-admin/dist/static/public
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
Reference in New Issue
Block a user