Skip to content

VueCompositionAPI not work nice, no error #124

Open
@DULANGHAI

Description

@DULANGHAI

when i try to build web components by vue-cli, components that use @vue/composition-api not work nice

I have a demo component like this

<template>
  <div>{{ timeText }}</div>
</template>

<script lang="ts">
import VueCompositionAPI, {
  computed,
  defineComponent,
} from "@vue/composition-api";
import Vue from "vue";

Vue.use(VueCompositionAPI);

export default defineComponent({
  props: {
    time: {
      type: [Number, String],
      default: 0,
    },
  },
  setup(props) {
    const timeText = computed(() => {
      return +props.time + +new Date() + "";
    });
    return {
      timeText,
    };
  },
});
</script>

copy to add another one component, then build web components

"test": "vue-cli-service build --target wc-async --name test-count './src/test/count.vue'",
"test2": "vue-cli-service build --target wc-async --name test-count2 './src/test/count.vue'",

import file

<script src="<%= BASE_URL %>test-count/test-count.js"></script>
<script src="<%= BASE_URL %>test-count2/test-count2.js"></script>

use in vue

<template>
  <div>
    <test-count time="108000000"></test-count>
    <test-count2 time="108000000"></test-count2>
  </div>
</template>

what i saw is
image

I don`t see any error。It really bothers me, help please

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions