项目作者: qq362334256

项目描述 :
这是一个 gulp 自动化构建的示例
高级语言: JavaScript
项目地址: git://github.com/qq362334256/gulp.git
创建时间: 2016-11-28T07:31:17Z
项目社区:https://github.com/qq362334256/gulp

开源协议:

下载


LIVEADMIN - 直播管家

使用

1、控制台进入到项目根目录下,示例: cd E:\www\pro\liveManager\webadmin

2、执行相应任务

  • 1)执行开发任务: gulp dev
  • 2)执行生产任务: gulp pro

项目结构

——- 根目录下 ——-

  1. ├── build
  2. └── config.json - 构建配置文件
  3. └── ... - 其他构建文件
  4. ├── node_modules - js依赖模块
  5. ├── src - 开发目录
  6. ├── components - 组件模块
  7. └── container.vue - 内容组件
  8. └── pages.vue - 分页组件
  9. └── popup.vue - 弹出框组件
  10. └── seldate.vue - 时间选择组件
  11. └── selmonth.vue - 月份选择组件
  12. ├── config - 配置模块
  13. └── api.config.js - api配置文件
  14. └── env.config.js - 环境配置文件
  15. └── resource.config.js - ajax配置文件
  16. └── router.config.js - 总路由配置文件
  17. ├── filters - 过滤器模块
  18. └── date.filter.js - 时间日期过滤器
  19. └── morh.filter.js - 分钟转换小时过滤器
  20. └── torate.filter.js - 百分比计算过滤器
  21. ├── public - 公共文件
  22. ├── font - 字体存放目录
  23. ├── images - 图片存放目录
  24. ├── style - 样式存放目录
  25. ├── service - 服务模块
  26. └── browsertitle.service.js - 设置网页title服务
  27. └── pageloading.service.js - 页面加载loading服务
  28. └── seturl.service.js - 设置url服务
  29. └── storage.service.js - 本地储存服务
  30. ├── store - 储存模块
  31. ├── module
  32. └── common.store.js - 核心储存
  33. └── user.store.js - 用户储存
  34. └── store.config.js - 储存配置
  35. ├── view - 视图模块
  36. ├── anchor - 主播管理
  37. ├── images - 图片目录
  38. ├── view
  39. └── ahdetail.page.vue - 主播详情页
  40. └── ahhistory.page.vue - 直播历史页
  41. └── ahmanage.page.vue - 主播管理页
  42. └── ahrecord.page.vue - 日直播记录页
  43. └── router.config.js - 分路由配置
  44. ├── check - 主播管理
  45. ├── view
  46. └── ckday.page.vue - 日考勤记录页
  47. └── ckmonth.page.vue - 月考勤记录页
  48. └── router.config.js - 分路由配置
  49. ├── guild - 公会管理
  50. ├── view
  51. └── agentset.page.vue - 经纪人设置页
  52. └── anchorset.page.vue - 主播设置页
  53. └── brushset.page.vue - 自刷账号页
  54. └── levelset.page.vue - 直播等级页
  55. └── theanchor.page.vue - 经纪人详情页
  56. └── updatepass.page.vue - 密码修改页
  57. └── router.config.js - 分路由配置
  58. ├── live - 直播管理
  59. ├── view
  60. └── addfans.page.vue - 增粉管理页
  61. └── income.page.vue - 收入分析页
  62. └── todayall.page.vue - 今日总览页
  63. └── currafanchor.page.vue - 今日增粉最高页
  64. └── curricanchor.page.vue - 今日收入最高页
  65. └── currolanchor.page.vue - 今日在线最高页
  66. └── currtlanchor.page.vue - 今日上播最高页
  67. └── ysafanchor.page.vue - 昨日增粉最高页
  68. └── ysicanchor.page.vue - 昨日收入最高页
  69. └── ysolanchor.page.vue - 昨日在线最高页
  70. └── ystlanchor.page.vue - 昨日上播最高页
  71. └── router.config.js - 分路由配置
  72. └── nav.tem.vue - 导航组件
  73. └── toolbar.tem.vue - 工具栏组件
  74. └── admin.page.vue - 后台管理总组件
  75. └── 404.page.vue - 404错误页
  76. └── debug.page.vue - 测试页面
  77. └── login.page.vue - 登陆页
  78. └── retrieve.page.vue - 找回密码页
  79. └── entry.js - 入口配置文件
  80. └── index.html - 入口html文件
  81. ├── static - pro生产打包资源目录
  82. ├── css - 样式资源
  83. ├── font - 字体资源
  84. ├── images - 图片资源
  85. ├── js - js资源
  86. └── index.html - 入口资源
  87. └── .babelrc - babel配置
  88. └── gulpfile.js - gulp任务配置
  89. └── package.json - 依赖说明
  90. └── README.md - 说明文档

构建配置说明(bulid/config.json)

  1. {
  2. "path": {
  3. "entry": "./../src", // 输入入口
  4. "outDev": "./../test", // 测试出口
  5. "outPro": "./../static" // 生产出口
  6. },
  7. "server": { // 测试服务配置
  8. "host": "127.0.0.1", // 访问地址
  9. "port": 5001 // 端口号
  10. },
  11. "domain": "http://1.itoubu.com/liveManager/webadmin/static/", // 网站域名
  12. "resource": "http://1.itoubu.com/liveManager", // 网站资源路径
  13. "module": ["common"], // 模块配置
  14. "maxLimit": 1024, // 最大构建图片大小
  15. "autoOpen": false, // 是否自动打开游览器
  16. "api_path": { // api地址配置
  17. "dev": "http://1.itoubu.com/liveManager", // 测试api服务地址
  18. "pro": "http://1.itoubu.com/liveManager" // 生产api服务地址
  19. }
  20. }

开发流程(src/)

  • 控制台中在根目录下在输入 gulp dev
  • 根据对应的模块在对应的目录下创建相应文件
  • 在 view/ 目录下开发相对应的页面 xxx.vue文件
  • 公共的静态资源文件存放在 public/ 下

打包流程

  • 控制台中在根目录下在输入 gulp pro
  • 等待时间打包完毕后的文件就会出现在 static/ 下