wu

wolf-ui

Showing:

Popularity

Downloads/wk

1

Maintenance

No Maintenance Data Available

Package

Dependencies

32

License

Type Definitions

Tree-Shakeable

No?

Categories

Readme

wolf-ui

演示地址

特性

  • 基于reactant-designdvaMock 企业级后台管理系统最佳实践。
  • 基于Antd UI 设计语言,提供后台管理系统常见使用场景。
  • 基于dva动态加载 Model 和路由,按需加载。
  • 使用roadhog本地调试和构建,其中Mock功能实现脱离后端独立开发。
  • 浅度响应式设计。

更新日志

开发构建

目录结构

├── /dist/           # 项目输出目录
├── /src/            # 项目源码目录
│ ├── /public/       # 公共文件,编译时copy至dist目录
│ ├── /components/   # UI组件及UI相关方法
│ │ ├── skin.less    # 全局样式
│ │ └── vars.less    # 全局样式变量
│ ├── /routes/       # 路由组件
│ │ └── app.js       # 路由入口
│ ├── /models/       # 数据模型
│ ├── /services/     # 数据接口
│ ├── /themes/       # 项目样式
│ ├── /mock/         # 数据mock
│ ├── /utils/        # 工具函数
│ │ ├── config.js    # 项目常规配置
│ │ ├── menu.js      # 菜单及面包屑配置
│ │ ├── config.js    # 项目常规配置
│ │ ├── request.js   # 异步请求函数
│ │ └── theme.js     # 项目需要在js中使用到样式变量
│ ├── route.js       # 路由配置
│ ├── index.js       # 入口文件
│ └── index.html     
├── package.json     # 项目信息
├── .eslintrc        # Eslint配置
└── .roadhogrc.js    # roadhog配置

文件夹命名说明:

  • components:组件(方法)为单位以文件夹保存,文件夹名组件首字母大写(如DataTable),方法首字母小写(如layer),文件夹内主文件与文件夹同名,多文件以index.js导出对象(如./src/components/Layout)。
  • routes:页面为单位以文件夹保存,文件夹名首字母小写(特殊除外,如UIElement),文件夹内主文件以index.js导出,多文件时可建立components文件夹(如./src/routes/dashboard),如果有子路由,依次按照路由层次建立文件夹(如./src/routes/UIElement)。

快速开始

克隆项目文件:

git clone https://github.com/zuiidea/antd-admin.git

进入目录安装依赖:

#开始前请确保没有安装roadhog、webpack到NPM全局目录
npm i 或者 yarn install

开发:

npm run build:dll #第一次npm run dev时需运行此命令,使开发时编译更快
npm run dev
打开 http://localhost:8000

构建: 详情

npm run build

将会打包至dist/{version}目录 #package.json里version字段

npm run build:new

将会打包至dist/{version增加1}目录 #package.json里version字段

代码检测:

npm run lint

FAQ

  • 项目打包后如何部署? #269

  • 如何做权限管理? #384

  • 如何使用mock.js模拟接口,怎么使用线上接口? #348

  • 如何使用Iconfont,如何使用本地的svg图标? #270

  • 怎么按版本打包,上线时不影响正在访问的用户? #449

  • windows处理CRLF?参考

    git config --global core.autocrlf false
    

参考

用户列表:https://github.com/dvajs/dva/tree/master/examples/user-dashboard

dashboard设计稿:https://dribbble.com/shots/3108122-Dashboard-Admin (已征得作者同意)

截屏

web

移动

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial