@melt-js/comps-vue3 0.0.1 → 2026.11.6

package/src/components/CircularMenu.vue

@@ -0,0 +1,348 @@
+<template>
+  <div class="cm" :class="[`cm--${variant}`, { 'is-open': open }]" :style="rootStyle">
+    <button
+      type="button"
+      class="cm__toggle"
+      :aria-expanded="open"
+      aria-haspopup="true"
+      :aria-label="open ? '关闭菜单' : '打开菜单'"
+      @click="open = !open"
+    >
+      {{ toggleLabel }}
+    </button>
+
+    <div class="cm__wheel">
+      <ul class="cm__list">
+        <li v-for="(item, index) in items" :key="index" class="cm__item" :style="itemStyle(index)">
+          <a
+            class="cm__link"
+            :class="{ 'is-active': item.active }"
+            :href="item.href || '#'"
+            @click="pick($event, item, index)"
+          >
+            <span class="cm__text">{{ item.label }}</span>
+          </a>
+        </li>
+      </ul>
+    </div>
+
+    <div v-if="overlay" class="cm__overlay" :class="{ 'is-open': open }" @click="open = false" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
+
+/*
+ * 由 _corner/底部菜单 的两个 jQuery demo 提取而来：
+ * - wheel：原 demo1，固定在视口底部，展开半个圆环，可带遮罩
+ * - fan：原 demo2，相对最近的定位祖先展开整个圆环，扇区依次散开
+ *
+ * 扇区半径、字体级联都沿用原 demo 的 em 数值，角度由 items.length 均分，
+ * 所以入口数量不再局限于原来的 5 个 / 7 个。
+ */
+type CircularMenuItem = {
+  label: string
+  href?: string
+  active?: boolean
+}
+
+const props = withDefaults(
+  defineProps<{
+    items: CircularMenuItem[]
+    variant?: 'wheel' | 'fan'
+    overlay?: boolean
+    openText?: string
+    closeText?: string
+  }>(),
+  { variant: 'wheel', overlay: false },
+)
+
+const emit = defineEmits<{ select: [item: CircularMenuItem, index: number] }>()
+
+const open = ref(false)
+
+// 原 demo1 的 5 项落在 -10°~150°，原 demo2 的 7 项落在 -20°~172°
+const GEOMETRY = {
+  wheel: { center: 70, span: 160, skew: 50, rotate: -70 },
+  fan: { center: 76, span: 192, skew: 60, rotate: -75 },
+}
+
+const geometry = computed(() => GEOMETRY[props.variant])
+
+const rootStyle = computed(() => ({
+  '--cm-skew': `${geometry.value.skew}deg`,
+  '--cm-rot': `${geometry.value.rotate}deg`,
+}))
+
+function itemStyle(index: number) {
+  const { center, span, skew } = geometry.value
+  const count = props.items.length
+  // 收起时 fan 的所有扇区叠在正中间，展开后才散开（对应原 demo2 的 rotate(76deg)）
+  const angle =
+    props.variant === 'fan' && !open.value
+      ? center
+      : center - span / 2 + (count > 1 ? (index * span) / (count - 1) : 0)
+
+  return { transform: `rotate(${angle}deg) skew(${skew}deg)` }
+}
+
+const toggleLabel = computed(() => {
+  const fallback = props.variant === 'fan' ? ['Menu', 'Close'] : ['+', '−']
+  return open.value ? props.closeText ?? fallback[1] : props.openText ?? fallback[0]
+})
+
+function pick(event: MouseEvent, item: CircularMenuItem, index: number) {
+  // 没给 href 时只抛事件，别让 href="#" 改掉宿主的 hash 路由
+  if (!item.href) event.preventDefault()
+  open.value = false
+  emit('select', item, index)
+}
+
+// 原 demo 靠 document 点击关闭，这里只收 Esc，避免给宿主页面挂全局监听
+function onKeydown(event: KeyboardEvent) {
+  if (event.key === 'Escape') open.value = false
+}
+
+onMounted(() => window.addEventListener('keydown', onKeydown))
+onBeforeUnmount(() => window.removeEventListener('keydown', onKeydown))
+</script>
+
+<style scoped>
+/* root 固定 16px 基准，宿主换字号时这套 em 布局不会走样 */
+.cm {
+  font-size: 16px;
+}
+
+.cm,
+.cm * {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.cm__toggle {
+  border: 0;
+  border-radius: 50%;
+  background-color: #fff;
+  font-family: inherit;
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+}
+
+/*
+ * ul 必须是定位元素：它高度为 0，扇区的 top: 50% 因此落在 0 上、再被 margin 顶上，
+ * 圆心才是 li 的右下角。原 demo 靠全局 * { position: relative } 得到这个结果。
+ */
+.cm__list {
+  position: relative;
+}
+
+.cm__item {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  width: 10em;
+  height: 10em;
+  margin: -1.3em 0 0 -10em;
+  font-size: 1.5em;
+  transform-origin: 100% 100%;
+  overflow: hidden;
+}
+
+.cm__link {
+  position: absolute;
+  right: -7.25em;
+  bottom: -7.25em;
+  display: block;
+  width: 14.5em;
+  height: 14.5em;
+  border-radius: 50%;
+  color: #fff;
+  text-align: center;
+  text-decoration: none;
+  transform: skew(calc(var(--cm-skew) * -1)) rotate(var(--cm-rot));
+  backface-visibility: hidden;
+}
+
+/* ------------------------------------------------------------------ wheel */
+
+.cm--wheel {
+  --cm-accent: #f06060;
+}
+
+.cm--wheel .cm__wheel {
+  position: fixed;
+  z-index: 41;
+  left: 50%;
+  bottom: -13em;
+  width: 26em;
+  height: 26em;
+  margin-left: -13em;
+  border-radius: 50%;
+  overflow: hidden;
+  transform: scale(0.1);
+  pointer-events: none;
+  transition: transform 0.3s ease;
+}
+
+.cm--wheel.is-open .cm__wheel {
+  transform: scale(1);
+  pointer-events: auto;
+}
+
+.cm--wheel .cm__link {
+  padding-top: 1.8em;
+  font-size: 1.18em;
+  background-color: hsla(0, 88%, 63%, 1);
+  transition: background-color 0.3s ease;
+}
+
+.cm--wheel .cm__item:nth-child(even) .cm__link {
+  background-color: hsla(0, 88%, 65%, 1);
+}
+
+.cm--wheel .cm__link:hover,
+.cm--wheel .cm__link:focus,
+.cm--wheel .cm__link:active,
+.cm--wheel .cm__link.is-active {
+  background-color: hsla(0, 88%, 70%, 1);
+}
+
+.cm--wheel .cm__text {
+  font-size: 1.1em;
+  opacity: 0.7;
+}
+
+.cm--wheel .cm__toggle {
+  position: fixed;
+  z-index: 42;
+  left: 50%;
+  bottom: -1.75em;
+  width: 3.5em;
+  height: 3.5em;
+  margin-left: -1.75em;
+  padding-bottom: 1em;
+  color: var(--cm-accent);
+  font-size: 1.8em;
+  text-align: center;
+}
+
+.cm--wheel .cm__toggle:hover,
+.cm--wheel .cm__toggle:focus {
+  color: #aa1010;
+}
+
+/* -------------------------------------------------------------------- fan */
+
+.cm--fan {
+  --cm-accent: #52be7f;
+}
+
+.cm--fan .cm__wheel {
+  position: absolute;
+  top: 100%;
+  left: 50%;
+  z-index: 10;
+  width: 27em;
+  height: 27em;
+  margin: -13em 0 0 -13.5em;
+  border-radius: 50%;
+  overflow: hidden;
+  opacity: 0;
+  transform: scale(0.1);
+  pointer-events: none;
+  transition: all 0.3s ease 0.3s;
+}
+
+.cm--fan.is-open .cm__wheel {
+  opacity: 1;
+  transform: scale(1);
+  pointer-events: auto;
+  transition: all 0.3s ease;
+}
+
+/* 盖住中间的空白，避免点到扇区多出来的部分 */
+.cm--fan .cm__wheel::after {
+  content: "";
+  position: absolute;
+  z-index: 10;
+  left: 50%;
+  top: 50%;
+  width: 6.2em;
+  height: 6.2em;
+  margin: -3.1em 0 0 -3.1em;
+  border-radius: 50%;
+  font-size: 2em;
+}
+
+.cm--fan .cm__item {
+  transition: transform 0.3s ease;
+}
+
+.cm--fan.is-open .cm__item {
+  transition: transform 0.3s ease 0.3s;
+}
+
+.cm--fan .cm__link {
+  font-size: 1.2em;
+  line-height: 2;
+  background: radial-gradient(transparent 35%, #429a67 35%);
+  pointer-events: auto;
+}
+
+.cm--fan .cm__link:hover,
+.cm--fan .cm__link:focus,
+.cm--fan .cm__link:active {
+  background: radial-gradient(transparent 35%, #449e6a 35%);
+}
+
+.cm--fan .cm__text {
+  position: relative;
+  top: 1.8em;
+  display: block;
+  font-size: 0.5em;
+  font-weight: 700;
+  text-transform: uppercase;
+}
+
+.cm--fan .cm__toggle {
+  position: absolute;
+  top: 100%;
+  left: 50%;
+  z-index: 11;
+  width: 4.5em;
+  height: 4.5em;
+  margin: -2.25em 0 0 -2.25em;
+  color: var(--cm-accent);
+  font-size: 1.5em;
+  font-weight: 700;
+  text-align: center;
+  text-transform: uppercase;
+}
+
+/* ---------------------------------------------------------------- overlay */
+
+/* 遮罩压在页面内容之上、环形菜单之下，开启时整页变暗（含宿主导航栏） */
+.cm__overlay {
+  position: fixed;
+  z-index: 40;
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.6);
+  opacity: 0;
+  visibility: hidden;
+  transition: opacity 0.3s ease, visibility 0.3s ease;
+}
+
+.cm__overlay.is-open {
+  opacity: 1;
+  visibility: visible;
+}
+
+@media screen and (max-width: 480px) {
+  .cm {
+    font-size: 11px;
+  }
+}
+</style>

package/src/components/HelloWorld.vue

@@ -2,6 +2,7 @@
   <div class="hello">
     <img alt="Vue logo" src="../assets/logo.png">
     <h1>{{ msg }}</h1>
+    <h3>name: {{ name }}</h3>
       <h3>hel-micro</h3>
     <p>
       A module federation SDK which is unrelated to tool chain for module consumer.
@@ -17,7 +18,8 @@ import { defineComponent, ref } from 'vue'
 export default defineComponent({
   name: 'HelloWorld',
   props: {
-    msg: String
+    msg: String,
+    name: String
   },
   setup() {
     // 验证远程组件复用的是宿主注入的 vue 运行时：

package/src/components/index.ts

@@ -1,12 +1,14 @@
-/*
-|--------------------------------------------------------------------------
-|
-| 这些组件暴露给使用方
-|
-|--------------------------------------------------------------------------
-*/
-import HelloWorld from './HelloWorld.vue'
-
-export default {
-  HelloWorld
-}
+/*
+|--------------------------------------------------------------------------
+|
+| 这些组件暴露给使用方
+|
+|--------------------------------------------------------------------------
+*/
+import HelloWorld from './HelloWorld.vue'
+import CircularMenu from './CircularMenu.vue'
+
+export default {
+  HelloWorld,
+  CircularMenu,
+}

package/src/entrance/libTypes.ts

@@ -8,6 +8,7 @@
 |
 |--------------------------------------------------------------------------
 */
+import type { Component } from 'vue';
 import { exposeLib } from 'hel-lib-proxy';
 import { LIB_NAME } from '../configs/subApp';
 
@@ -18,6 +19,7 @@ export type CompTypes = {
   HelloWorld: {
     name: string,
   },
+  CircularMenu: Component,
 };
 
 /**

package/hel_dist/css/105.95ddac72.css

@@ -1 +0,0 @@
-h3[data-v-24006543]{margin:40px 0 0}ul[data-v-24006543]{list-style-type:none;padding:0}li[data-v-24006543]{display:inline-block;margin:0 10px}a[data-v-24006543]{color:#42b983}.remote-btn[data-v-24006543]{margin-top:20px;padding:8px 16px;border:1px solid #42b983;border-radius:6px;background:#fff;color:#42b983;font-size:16px;cursor:pointer}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50;margin-top:60px}

package/hel_dist/js/105.78ba830f.js

@@ -1,2 +0,0 @@
-"use strict";(self["helJsonp_comps-vue3_1793864967767"]=self["helJsonp_comps-vue3_1793864967767"]||[]).push([[105],{198:function(t,e,c){c.d(e,{default:function(){return o}});var n=c(74),l={HelloWorld:n.A},o=l},480:function(t,e,c){var n=c(508);function l(t,e,c,l,o,i){const I=(0,n.resolveComponent)("HelloWorld");return(0,n.openBlock)(),(0,n.createBlock)(I,{msg:"Welcome to Your Vue.js + TypeScript + hel-micro App"})}var o=c(74),i=(0,n.defineComponent)({name:"App",components:{HelloWorld:o.A}}),I=c(7);const r=(0,I.A)(i,[["render",l]]);var s=r;(0,n.createApp)(s).mount("#app")},74:function(t,e,c){c.d(e,{A:function(){return h}});var n=c(508),l="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTk2QkI4RkE3NjE2MTFFNUE4NEU4RkIxNjQ5MTYyRDgiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTk2QkI4Rjk3NjE2MTFFNUE4NEU4RkIxNjQ5MTYyRDgiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NjU2QTEyNzk3NjkyMTFFMzkxODk4RDkwQkY4Q0U0NzYiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NjU2QTEyN0E3NjkyMTFFMzkxODk4RDkwQkY4Q0U0NzYiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5WHowqAAAXNElEQVR42uxda4xd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";const o={class:"hello"};function i(t,e,c,i,I,r){return(0,n.openBlock)(),(0,n.createElementBlock)("div",o,[e[1]||(e[1]=(0,n.createElementVNode)("img",{alt:"Vue logo",src:l},null,-1)),(0,n.createElementVNode)("h1",null,(0,n.toDisplayString)(t.msg),1),e[2]||(e[2]=(0,n.createElementVNode)("h3",null,"hel-micro",-1)),e[3]||(e[3]=(0,n.createElementVNode)("p",null,[(0,n.createTextVNode)(" A module federation SDK which is unrelated to tool chain for module consumer. checkout the "),(0,n.createElementVNode)("a",{href:"https://tnfe.github.io/hel/",target:"_blank",rel:"noopener"},"hel-micro documentation"),(0,n.createTextVNode)(". ")],-1)),(0,n.createElementVNode)("button",{class:"remote-btn",onClick:e[0]||(e[0]=e=>t.count++)},"远程组件内部计数 "+(0,n.toDisplayString)(t.count),1)])}var I=(0,n.defineComponent)({name:"HelloWorld",props:{msg:String},setup(){const t=(0,n.ref)(0);return{count:t}}}),r=c(7);const s=(0,r.A)(I,[["render",i],["__scopeId","data-v-24006543"]]);var h=s},7:function(t,e){e.A=(t,e)=>{const c=t.__vccOpts||t;for(const[n,l]of e)c[n]=l;return c}}}]);
-//# sourceMappingURL=105.78ba830f.js.map

package/hel_dist/js/105.78ba830f.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"js/105.78ba830f.js","mappings":"0LASAA,EAAA,CACEC,WAAUA,EAAAA,GCDZC,EAAA,oCCPM,SAAUC,EAAOC,EAAUC,EAAYC,EAAYC,EAAYC,EAAWC,GAC9E,MAAMC,GAAwBC,EAAAA,EAAAA,kBAAkB,cAEhD,OAAQC,EAAAA,EAAAA,cCJRC,EAAAA,EAAAA,aAAuEH,EAAA,CAA3DI,IAAI,uDDKlB,aCEAC,GAAeC,EAAAA,EAAAA,iBAAgB,CAC7BC,KAAM,MACNjB,WAAY,CACVC,WAAUA,EAAAA,YCJd,MAAAiB,GAAiC,EAAAC,EAAAC,GAAgBL,EAAM,WAAaZ,KAEpE,IAAAkB,EAAA,GCNAC,EAAAA,EAAAA,WAAUD,GAAKE,MAAM,ghSCCrB,MAAMC,EAAa,CCHZC,MAAM,SDKP,SAAUtB,EAAOC,EAAUC,EAAYC,EAAYC,EAAYC,EAAWC,GAC9E,OAAQG,EAAAA,EAAAA,cCNRc,EAAAA,EAAAA,oBASM,MATNF,EASM,CDFJnB,EAAO,KAAOA,EAAO,ICNrBsB,EAAAA,EAAAA,oBAA6C,OAAxCC,IAAI,WAAWC,IAAAC,GDSjB,MAAO,KCRVH,EAAAA,EAAAA,oBAAkB,WAAAI,EAAAA,EAAAA,iBAAX3B,EAAAU,KAAG,GDUVT,EAAO,KAAOA,EAAO,ICTnBsB,EAAAA,EAAAA,oBAAkB,UAAd,aAAS,IDUftB,EAAO,KAAOA,EAAO,ICTrBsB,EAAAA,EAAAA,oBAGI,WDOFK,EAAAA,EAAAA,iBCVC,iGAEYL,EAAAA,EAAAA,oBAAgG,KAA7FM,KAAK,8BAA8BC,OAAO,SAASC,IAAI,YAAW,4BDclFH,EAAAA,EAAAA,iBCd6G,QDe3G,KCbJL,EAAAA,EAAAA,oBAAyE,UAAjEF,MAAM,aAAcW,QAAK/B,EAAA,KAAAA,EAAA,GAAAgC,GAAEjC,EAAAkC,UAAS,aAASP,EAAAA,EAAAA,iBAAG3B,EAAAkC,OAAK,IDmBjE,CCZA,IAAAC,GAAevB,EAAAA,EAAAA,iBAAgB,CAC7BC,KAAM,aACNuB,MAAO,CACL1B,IAAK2B,QAEPC,KAAAA,GAGE,MAAMJ,GAAQK,EAAAA,EAAAA,KAAI,GAClB,MAAO,CAAEL,QACX,WCnBF,MAAApB,GAAiC,EAAAC,EAAAC,GAAgBmB,EAAM,WAAapC,GAAM,kCAE1E,IAAAF,EAAA,mBCLA2C,EAAAxB,EAAe,CAAAyB,EAAAL,KACf,MAAAN,EAAAW,EAAAC,WAAAD,EACA,UAAAE,EAAAC,KAAAR,EACAN,EAAAa,GAAAC,EAEA,OAAAd","sources":["webpack://comps-vue3/./src/components/index.ts","webpack://comps-vue3/./src/entrance/libProperties.ts","webpack://comps-vue3/./src/App.vue?eb67","webpack://comps-vue3/./src/App.vue","webpack://comps-vue3/./src/App.vue?bb66","webpack://comps-vue3/./src/loadApp.ts","webpack://comps-vue3/./src/components/HelloWorld.vue?9e80","webpack://comps-vue3/./src/components/HelloWorld.vue","webpack://comps-vue3/./src/components/HelloWorld.vue?50ad","webpack://comps-vue3/../node_modules/.pnpm/vue-loader@17.4.2_@vue+comp_b96250859ca94a6ac58450dbb1a8bad8/node_modules/vue-loader/dist/exportHelper.js"],"sourcesContent":["/*\r\n|--------------------------------------------------------------------------\r\n|\r\n| 这些组件暴露给使用方\r\n|\r\n|--------------------------------------------------------------------------\r\n*/\r\nimport HelloWorld from './HelloWorld.vue'\r\n\r\nexport default {\r\n  HelloWorld\r\n}\r\n","/*\r\n|--------------------------------------------------------------------------\r\n|\r\n| 这些组件暴露给使用方\r\n|\r\n|--------------------------------------------------------------------------\r\n*/\r\nimport comps from '../components'\r\n\r\nexport default comps\r\n","import { resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock } from \"vue\"\n\nexport function render(_ctx: any,_cache: any,$props: any,$setup: any,$data: any,$options: any) {\n  const _component_HelloWorld = _resolveComponent(\"HelloWorld\")!\n\n  return (_openBlock(), _createBlock(_component_HelloWorld, { msg: \"Welcome to Your Vue.js + TypeScript + hel-micro App\" }))\n}","<template>\r\n  <HelloWorld msg=\"Welcome to Your Vue.js + TypeScript + hel-micro App\"/>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { defineComponent } from 'vue'\r\nimport HelloWorld from './components/HelloWorld.vue'\r\n\r\nexport default defineComponent({\r\n  name: 'App',\r\n  components: {\r\n    HelloWorld\r\n  }\r\n})\r\n</script>\r\n\r\n<style>\r\n#app {\r\n  font-family: Avenir, Helvetica, Arial, sans-serif;\r\n  -webkit-font-smoothing: antialiased;\r\n  -moz-osx-font-smoothing: grayscale;\r\n  text-align: center;\r\n  color: #2c3e50;\r\n  margin-top: 60px;\r\n}\r\n</style>\r\n","import { render } from \"./App.vue?vue&type=template&id=18180672&ts=true\"\nimport script from \"./App.vue?vue&type=script&lang=ts\"\nexport * from \"./App.vue?vue&type=script&lang=ts\"\n\nimport \"./App.vue?vue&type=style&index=0&id=18180672&lang=css\"\n\nimport exportComponent from \"../../node_modules/.pnpm/vue-loader@17.4.2_@vue+comp_b96250859ca94a6ac58450dbb1a8bad8/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","import { createApp } from 'vue'\r\nimport App from './App.vue'\r\n\r\ncreateApp(App).mount('#app')\r\n","import { createElementVNode as _createElementVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\nimport _imports_0 from '../assets/logo.png'\n\n\nconst _hoisted_1 = { class: \"hello\" }\n\nexport function render(_ctx: any,_cache: any,$props: any,$setup: any,$data: any,$options: any) {\n  return (_openBlock(), _createElementBlock(\"div\", _hoisted_1, [\n    _cache[1] || (_cache[1] = _createElementVNode(\"img\", {\n      alt: \"Vue logo\",\n      src: _imports_0\n    }, null, -1)),\n    _createElementVNode(\"h1\", null, _toDisplayString(_ctx.msg), 1),\n    _cache[2] || (_cache[2] = _createElementVNode(\"h3\", null, \"hel-micro\", -1)),\n    _cache[3] || (_cache[3] = _createElementVNode(\"p\", null, [\n      _createTextVNode(\" A module federation SDK which is unrelated to tool chain for module consumer. checkout the \"),\n      _createElementVNode(\"a\", {\n        href: \"https://tnfe.github.io/hel/\",\n        target: \"_blank\",\n        rel: \"noopener\"\n      }, \"hel-micro documentation\"),\n      _createTextVNode(\". \")\n    ], -1)),\n    _createElementVNode(\"button\", {\n      class: \"remote-btn\",\n      onClick: _cache[0] || (_cache[0] = ($event: any) => (_ctx.count++))\n    }, \"远程组件内部计数 \" + _toDisplayString(_ctx.count), 1)\n  ]))\n}","<template>\n  <div class=\"hello\">\n    <img alt=\"Vue logo\" src=\"../assets/logo.png\">\n    <h1>{{ msg }}</h1>\n      <h3>hel-micro</h3>\n    <p>\n      A module federation SDK which is unrelated to tool chain for module consumer.\n      checkout the <a href=\"https://tnfe.github.io/hel/\" target=\"_blank\" rel=\"noopener\">hel-micro documentation</a>.\n    </p>\n    <button class=\"remote-btn\" @click=\"count++\">远程组件内部计数 {{ count }}</button>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\n\nexport default defineComponent({\n  name: 'HelloWorld',\n  props: {\n    msg: String\n  },\n  setup() {\n    // 验证远程组件复用的是宿主注入的 vue 运行时：\n    // 若是两份 vue，这里的 ref 变更不会触发宿主渲染。\n    const count = ref(0)\n    return { count }\n  }\n})\n</script>\n\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\n<style scoped>\nh3 {\n  margin: 40px 0 0;\n}\nul {\n  list-style-type: none;\n  padding: 0;\n}\nli {\n  display: inline-block;\n  margin: 0 10px;\n}\na {\n  color: #42b983;\n}\n.remote-btn {\n  margin-top: 20px;\n  padding: 8px 16px;\n  border: 1px solid #42b983;\n  border-radius: 6px;\n  background: #fff;\n  color: #42b983;\n  font-size: 16px;\n  cursor: pointer;\n}\n</style>\n","import { render } from \"./HelloWorld.vue?vue&type=template&id=24006543&scoped=true&ts=true\"\nimport script from \"./HelloWorld.vue?vue&type=script&lang=ts\"\nexport * from \"./HelloWorld.vue?vue&type=script&lang=ts\"\n\nimport \"./HelloWorld.vue?vue&type=style&index=0&id=24006543&scoped=true&lang=css\"\n\nimport exportComponent from \"../../../node_modules/.pnpm/vue-loader@17.4.2_@vue+comp_b96250859ca94a6ac58450dbb1a8bad8/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render],['__scopeId',\"data-v-24006543\"]])\n\nexport default __exports__","\"use strict\";\nObject.defineProperty(exports, \"__esModule\", { value: true });\n// runtime helper for setting properties on components\n// in a tree-shakable way\nexports.default = (sfc, props) => {\n    const target = sfc.__vccOpts || sfc;\n    for (const [key, val] of props) {\n        target[key] = val;\n    }\n    return target;\n};\n"],"names":["components","HelloWorld","libProperties","render","_ctx","_cache","$props","$setup","$data","$options","_component_HelloWorld","_resolveComponent","_openBlock","_createBlock","msg","Appvue_type_script_lang_ts","defineComponent","name","__exports__","exportHelper","A","App","createApp","mount","_hoisted_1","class","_createElementBlock","_createElementVNode","alt","src","_imports_0","_toDisplayString","_createTextVNode","href","target","rel","onClick","$event","count","HelloWorldvue_type_script_lang_ts","props","String","setup","ref","exports","sfc","__vccOpts","key","val"],"sourceRoot":""}