h5 前端扩展点自定义组件发布步骤
一、在 h5-extension 目录里进行开发
目录结构如下:
目录含义如下:
├── dist 构建结果
├── src 源码目录
│ └── _global 全局组件目录(目录名固定)
│ └── node_buy 下单页节点(和有赞提供节点标识一致,更多节点表标识可在下方表格中查看)
│ ├── _common 节点级组件目录(目录名固定)
│ └── buy 下单页模版(和有赞提供模版标识一致,更多模板标识可在下方表格中查看)
│ ├── components 自定义组件目录
│ └── Xxx 自定义组件
│ └── App.vue 自定义组件指定入口文件
└── package.json
注:以上目录名有具体要求,请开发时确认正确。
二、创建的目录名称必须按照上面的结构和下面的节点标识、模板标识匹配,否则在对应的前端路由配置中看不到。
节点 | 节点标识 | 模版 | 模版标识 |
---|---|---|---|
订单列表 | node_order-list | 订单列表页 | order-list |
会员中心 | node_member-center | 会员中心页 | member-center |
购物车 | node_cart | 购物车 | cart |
订单详情 | node_order-detail | 订单详情页 | order-detail |
支付完成 | node_order-pay-result | 支付结果页 | order-pay-result |
下单页 | node_buy | 下单页 | buy |
商品详情 | node_goods-detail | 限时折扣商品详情 | goods-detail__timelimitedDiscount |
抽奖拼团商品详情 | goods-detail__luckyDrawGroup | ||
团购返现商品详情 | goods-detail__tuan | ||
F 码商品详情 | goods-detail__fcode | ||
积分商品详情 | goods-detail__points | ||
拼团商品详情 | goods-detail__groupon | ||
降价拍商品详情 | goods-detail__auction | ||
普通商品详情页 | goods-detail__goods |
三、进入到 package.json 所在目录下,执行 npm run release 进行发布
如果上面的操作部分无误,且发布是成功的,请确认一下 Git 仓库的 URL 地址是否正确,是否是所在项目的地址,且以.git 结尾的。
如果配置的不正确,会因为找不到项目名称而识别不到发布成功的自定义组件。