"File '...TodoButton.vue.ts' is not a module.ts(2306)"
Supporting Information
Issue:
Vue SFC Import Error: "File '...TodoButton.vue.ts' is not a module.ts(2306)"
Description:
When trying to import a Vue Single File Component (SFC) in a TypeScript environment, the error message "File '...TodoButton.vue.ts' is not a module.ts(2306)" is encountered.
Steps to Reproduce:
Create a Vue SFC (e.g., TodoButton.vue).
Within the SFC, use a <script> tag with lang="ts" but without the setup attribute.
In another component or Vue file, try to import the aforementioned SFC.
Expected Behavior:
The Vue SFC should be imported without any errors.
Actual Behavior:
The error "File '...TodoButton.vue.ts' is not a module.ts(2306)" is thrown, making it seem as though the imported Vue component is not recognized as a proper module.
Solution:
Ensure that the <script> tag in the Vue SFC includes the setup attribute when working in the Composition API context with TypeScript:
<script setup lang="ts">
// Your setup code here
</script>
By adding the setup attribute, Vue treats the file as a proper module/component, and the error is resolved.
Error Text
"File '...TodoButton.vue.ts' is not a module.ts(2306)"
Supporting Information
Issue: Vue SFC Import Error: "File '...TodoButton.vue.ts' is not a module.ts(2306)"
Description: When trying to import a Vue Single File Component (SFC) in a TypeScript environment, the error message "File '...TodoButton.vue.ts' is not a module.ts(2306)" is encountered.
Steps to Reproduce:
TodoButton.vue
).<script>
tag withlang="ts"
but without thesetup
attribute.Expected Behavior: The Vue SFC should be imported without any errors.
Actual Behavior: The error "File '...TodoButton.vue.ts' is not a module.ts(2306)" is thrown, making it seem as though the imported Vue component is not recognized as a proper module.
Solution: Ensure that the
<script>
tag in the Vue SFC includes thesetup
attribute when working in the Composition API context with TypeScript:By adding the
setup
attribute, Vue treats the file as a proper module/component, and the error is resolved.Environment:
^3.3.4
~5.2.0
^8.49.0