Vue code throws error, has no default Export on Editor Terminal

There is no problem in Browser, i am getting needed output. But why is this showing in Editor Terminal constantly?

Any Help would be much appreciated.

No Default export Error:

Module '"/vue3/src/components/TestIcon.vue"' has no default export.

My component looks like this.

TestIcon.vue

<template>
  <span v-html="svg" class="icon-wrapper" ref="iconWrapper"></span>
</template>    
<script setup lang="ts">
import type { tycon } from "test-icons";
import { computed, onMounted, ref } from "vue";
import { completeDataSet } from "test-icons";

const props = defineProps<{
  icon: tycon;
  class: string;
  color: string;
  height: string;
  width: string;
}>();
const iconPassed = completeDataSet.find((item) => item.name === props.icon);

const svg = computed(() => iconPassed?.data);

const iconWrapper = ref<HTMLElement | null>(null);

onMounted(() => {
  iconWrapper.value?.lastElementChild?.firstElementChild?.setAttribute(
    "class",
    props.class
  );

  iconWrapper.value?.firstElementChild?.setAttribute(
    "style",
    "width:" + props.width + "px;height:" + props.height + "px;"
  );

  iconWrapper.value?.firstElementChild?.firstElementChild?.setAttribute(
    "fill",
    props.color
  );
});
</script>

App.vue:

<template>
  <main>
    <TestIcon :icon="'icon_test'" :class="'tests'" :height="40" :width="40" />
  </main>
</template>
<script lang="ts">
import TestIcon from "@/components/TestIcon.vue";
export default {
  components: {
    TestIcon,
  }
};
</script>