123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135 |
- Ant Design Jeecg Vue
- ====
- 当前最新版本: 2.4.6(发布日期:20210816)
- Overview
- ----
- 基于 [Ant Design of Vue](https://vuecomponent.github.io/ant-design-vue/docs/vue/introduce-cn/) 实现的 Ant Design Pro Vue 版
- Jeecg-boot 的前端UI框架,采用前后端分离方案,提供强大代码生成器的低代码平台。
- 前端页面代码和后端功能代码一键生成,不需要写任何代码,保持jeecg一贯的强大!!
- #### 前端技术
-
- - 基础框架:[ant-design-vue](https://github.com/vueComponent/ant-design-vue) - Ant Design Of Vue 实现
- - JavaScript框架:Vue
- - Webpack
- - node
- - yarn
- - eslint
- - @vue/cli 3.2.1
- - [vue-cropper](https://github.com/xyxiao001/vue-cropper) - 头像裁剪组件
- - [@antv/g2](https://antv.alipay.com/zh-cn/index.html) - Alipay AntV 数据可视化图表
- - [Viser-vue](https://viserjs.github.io/docs.html#/viser/guide/installation) - antv/g2 封装实现
- 项目下载和运行
- ----
- - 拉取项目代码
- ```bash
- git clone https://github.com/zhangdaiscott/jeecg-boot.git
- cd jeecg-boot/ant-design-vue-jeecg
- ```
- - 安装依赖
- ```
- yarn install
- ```
- - 开发模式运行
- ```
- yarn run serve
- ```
- - 编译项目
- ```
- yarn run build
- ```
- - Lints and fixes files
- ```
- yarn run lint
- ```
- 其他说明
- ----
- - 项目使用的 [vue-cli3](https://cli.vuejs.org/guide/), 请更新您的 cli
- - 关闭 Eslint (不推荐) 移除 `package.json` 中 `eslintConfig` 整个节点代码
- - 修改 Ant Design 配色,在文件 `vue.config.js` 中,其他 less 变量覆盖参考 [ant design](https://ant.design/docs/react/customize-theme-cn) 官方说明
- ```ecmascript 6
- css: {
- loaderOptions: {
- less: {
- modifyVars: {
- /* less 变量覆盖,用于自定义 ant design 主题 */
- 'primary-color': '#F5222D',
- 'link-color': '#F5222D',
- 'border-radius-base': '4px',
- },
- javascriptEnabled: true,
- }
- }
- }
- ```
- 附属文档
- ----
- - [Ant Design Vue](https://vuecomponent.github.io/ant-design-vue/docs/vue/introduce-cn)
- - [报表 viser-vue](https://viserjs.github.io/demo.html#/viser/bar/basic-bar)
- - [Vue](https://cn.vuejs.org/v2/guide)
- - [路由/菜单说明](https://github.com/zhangdaiscott/jeecg-boot/tree/master/ant-design-vue-jeecg/src/router/README.md)
- - [ANTD 默认配置项](https://github.com/zhangdaiscott/jeecg-boot/tree/master/ant-design-vue-jeecg/src/defaultSettings.js)
- - 其他待补充...
- 备注
- ----
- > @vue/cli 升级后,eslint 规则更新了。由于影响到全部 .vue 文件,需要逐个验证。既暂时关闭部分原本不验证的规则,后期维护时,在逐步修正这些 rules
- Docker 镜像使用
- ----
- ```
- # 1.修改前端项目的后台域名
- .env.development
- 域名改成: http://jeecg-boot-system:8080/jeecg-boot
-
- # 2.先进入打包前端项目
- yarn run build
- # 3.构建镜像
- docker build -t nginx:jeecgboot .
- # 4.启动镜像
- docker run --name jeecg-boot-nginx -p 80:80 -d nginx:jeecgboot
- # 5.配置host
- # jeecgboot
- 127.0.0.1 jeecg-boot-redis
- 127.0.0.1 jeecg-boot-mysql
- 127.0.0.1 jeecg-boot-system
-
- # 6.访问前台项目
- http://localhost:80
- ```
|