Cannot resolve symbol 'VueComponent'

[twoheart]

how to fix the error? although it works…

[twoheart]

<script lang="ts">
import {inject, Ref} from 'vue';
import { VueComponent as ToggleIcon } from '../assets/icon/menu.svg';

export default {
  components: {
    ToggleIcon
  },
  setup() {
    const asideVisible = inject<Ref<boolean>>('asideVisible');
    const toggleAside = () => {
      asideVisible.value = !asideVisible.value
    }
    return {
      toggleAside
    }
  }
};
</script>

[Damian Stasik]

@twoheartliu due to the dynamic nature of the SVG components, you will need to create/edit a .d.ts file with module declarations. This snippet should help you get rid of the error:

declare module '*.svg' {
  const src: string;
  const VueComponent: SVGElement;

  export { VueComponent };
  export default src;
}

[twoheart]

thx! It truly works in VS Code. But WebStorm seems cannot recognize shims-vue.d.ts file, so still have this error. I searched a lot but cannot resolve :(