chanjet-h5-hub

hsy-h5-hub 实时调度 H5 项目

• hsy-h5-hub 实时调度 H5 项目
  • H5 项目集合
  • flyweight-prefix
  • hsy-h5-prefix
  • H5 页面调用方法
    • 通过网址直接访问
    • 通过 api 访问
  • 环境准备
  • 如何调试本地子应用
  • 在 console 中查看变更情况

H5 项目集合

所有子应用独立开发独立部署，但是在部署阶段，会将 dist 上传到 cdn 规定路径下

路由前辍	仓库地址	入口地址	灰度环境
flyweight 路由前辍	http://gitlab.rd.chanjet.com/hsy_ng/flyweight-h5	https://[env-]mshop-h5.chanjet.com/index.html	有
hsy-h5 路由前辍	http://gitlab.rd.chanjet.com/hsy_ng/hsy-mobile-h5	https://[env-]hys-h5.chanjet.com/index.html	无
/archives	http://gitlab.rd.chanjet.com/cc_web/saas-hsy-h5-archives	https://cloud.static.chanjet.com/archives/[env]	无
/help-center	http://gitlab.rd.chanjet.com/cc_web/help-center-h5	https://cloud.static.chanjet.com/help-center-h5/[env]	无
/arap	http://gitlab.rd.chanjet.com/cc_web/saas-hsy-h5-arap	https://cloud.static.chanjet.com/arap/[env]/	无
/report	http://gitlab.rd.chanjet.com/cc_web/saas-hsy-h5-report	https://cloud.static.chanjet.com/cc_h5/[env]/	无
/information-framework	http://gitlab.rd.chanjet.com/cc_web/saas-hsy-h5-information-framework	https://cloud.static.chanjet.com/information-framework/[env]	无
/stock	http://gitlab.rd.chanjet.com/cc_web/saas-hsy-h5-stock	https://cloud.static.chanjet.com/stock/[env]	无
/voucher	http://gitlab.rd.chanjet.com/cc_web/saas-hsy-h5-voucher	https://cloud.static.chanjet.com/voucher/[env]	无

flyweight-prefix

  '/goodsList',
  '/custVendorListWillContact',
  '/custVendorListWithProblem', // 问题客户
  '/custVendorListAll',
  '/checkGoods',
  '/commoditySharing', // 推荐商品
  '/couponSharing', // 促销活动分享页面
  '/makePoster', // 海报分享页面
  '/Editor', // 添加备注跟进
  '/CustDetail', // 客户详情页面
  '/extension', // 线上推广分析
  '/p-rank',
  '/cust-rank', // 客户活跃排行
  '/emp-rank',
  '/emp-sd',
  '/customer',
  '/promotion', // 商品推广
  '/mshop', // 访客数 | 浏览量 |
  '/wechatInvitationFromOldCust',
  '/customerManager', // 客户管理
  '/customerSupport',
  '/promotionFilter',
  '/promotionDetails',
  '/treescreen',
  '/screen',
  '/checkboxSelect',
  '/SelectPaymentDate',
  '/SelectPriceList',
  '/SelectReceiptType',
  '/SelectCustomerType',
  '/custVendorLabel',
  '/inviteCustomers',
  '/selectSalesmen',
  '/activePda',
  '/multiGraphShareTo',
  '/multiGraphShare',
  '/addCustomer',
  '/callPlanning',
  '/business',
  '/createPlan',
  '/customerList',
  '/routeManager',
  '/addRoute',
  '/visitSettings',
  '/visitTask',
  '/imageCollection',
  '/visitSummary',
  '/promocouponshare', // 分享促销
  '/couponlistshare', // 分享优惠券

hsy-h5-prefix

'/sale',
'/inventory',
'/settings',
'/product',
'/capital'

H5 页面调用方法

主应用域名

环境	域名	已有
开发	https://dev-chanjet-h5-hub.chanjet.com	ok
预测	https://pre-test-chanjet-h5-hub.chanjet.com	ok
测试	https://test-chanjet-h5-hub.chanjet.com	ok
测试备用	https://test-b-chanjet-h5-hub.chanjet.com
集测	https://inte-chanjet-h5-hub.chanjet.com	ok
灰度	https://hd-chanjet-h5-hub.chanjet.com
热修复	https://hotfix-chanjet-h5-hub.chanjet.com	ok
生产	https://chanjet-h5-hub.chanjet.com	ok

通过网址直接访问

https://[env-]chanjet-h5-hub.chanjet.com/prefix

通过 api 访问

// 建议 不需要传递状态
window.$navigateToUrl((url: string));
// 可选 需要传递state时
history.pushState(state, title, url);

环境准备

- nodejs >= 10.0.0     # nodejs尽量使用最新的 lts 版本，
- vscode               # IDE统一使用`vscode`, 内置的辅助插件有助于快速开发
- yarn                 # 包管理统一使用yarn
- npm.rd.chanjet.com   # 必须指定npm私服, 核心依赖只能从私服拉取

如何调试本地子应用

以小档案为例演示如何连接本地应用

1. 首先从基座中打开小档案的页面例如: https://inte-chanjet-h5-hub.chanjet.com/archives#/archives-enter
2. 添加调试参数
   1. 参数规则： 应用名称=本地开发端口，
   2. 参数： archives=8089,
   3. 完整地址：https://inte-chanjet-h5-hub.chanjet.com/archives#/archives-enter?archives=8089
   4. 刷新页面或直接粘贴完整地址进入

在 console 中查看变更情况

修改前

修改后