diff --git a/docs/README.md b/docs/README.md index 702acb3c..af816353 100644 --- a/docs/README.md +++ b/docs/README.md @@ -1,3 +1,8 @@ +

+ + antd-admin + +

AntD Admin

diff --git a/docs/_sidebar.md b/docs/_sidebar.md index e4ce764b..5a052670 100644 --- a/docs/_sidebar.md +++ b/docs/_sidebar.md @@ -4,5 +4,4 @@ - [Configuration](configuration.md) - Guide - [Deploy](deploy.md) -- Changelog - - 5.0.0 +- [Change Log](change-log.md) diff --git a/docs/change-log.md b/docs/change-log.md new file mode 100644 index 00000000..003adf1a --- /dev/null +++ b/docs/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`. \ No newline at end of file diff --git a/docs/deploy.md b/docs/deploy.md index e69de29b..7f61bc58 100644 --- a/docs/deploy.md +++ b/docs/deploy.md @@ -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 +} + +``` diff --git a/docs/index.html b/docs/index.html index 863b0767..e981d4ca 100644 --- a/docs/index.html +++ b/docs/index.html @@ -8,7 +8,7 @@ - + @@ -38,8 +38,7 @@ '/zh-cn/': '找不到结果', '/': 'No Results' } - }, - // homepage: 'https://raw.githubusercontent.com/zuiidea/antd-admin/master/README.md' + } } // if (typeof navigator.serviceWorker !== 'undefined') { diff --git a/docs/zh-cn/README.md b/docs/zh-cn/README.md index 9a94d084..e1a63e7c 100644 --- a/docs/zh-cn/README.md +++ b/docs/zh-cn/README.md @@ -1,3 +1,8 @@ +

+ + antd-admin + +

AntD Admin

diff --git a/docs/zh-cn/_sidebar.md b/docs/zh-cn/_sidebar.md index 03655388..f38aecbf 100644 --- a/docs/zh-cn/_sidebar.md +++ b/docs/zh-cn/_sidebar.md @@ -4,5 +4,4 @@ - [配置项](zh-cn/configuration.md) - 指南 - [部署](zh-cn/deploy.md) -- 更新日志 - - 5.0.0 +- [更新日志](zh-cn/change-log.md) diff --git a/docs/zh-cn/change-log.md b/docs/zh-cn/change-log.md new file mode 100644 index 00000000..e3ef9546 --- /dev/null +++ b/docs/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` 中有很好的支持和可替代的。 + + diff --git a/docs/zh-cn/deploy.md b/docs/zh-cn/deploy.md index c2e43552..bd2218b2 100644 --- a/docs/zh-cn/deploy.md +++ b/docs/zh-cn/deploy.md @@ -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 +} + +```