Search code examples
typescriptvue.jsvue-i18n

Vue-i18n do not have default export

all! This is the first time I apply vue-i18n in my typeScript + Vue project. As the official site guided, I install it by using yarn install vue-i18n, then I want import it in main.ts via import VueI18n from 'vue-i18n', and it shows error below. Why this would happen and how could I fix it? Thanks in advance.

Module 
'"/Users/scott/Desktop/Pando/uikit-main/node_modules/vue-i18n/dist/vue-i18n"' 
has no default export. 
Did you mean to use 'import { VueI18n } from "/Users/scott/Desktop/Pando/uikit-main/node_modules/vue-i18n/dist/vue-i18n"' instead?ts(2613)

My vue-i18n version is "vue-i18n": "^9.1.9". If I import vue-i18n as suggested, then if I continue to type Vue.use(VueI18n), it will generate another error.

'VueI18n' only refers to a type, but is being used as a value here.ts(2693)

I think this is because vue-i18n only export some interface.

(alias) interface VueI18n<Messages = {}, DateTimeFormats = {}, NumberFormats = {}>
import VueI18n

And backtrack the key word VueI18n in the import, I found it doesn't have any default export.

Solution

  • Have you tried to copy the route just like this (I use Vscode) and then paste it in the import part to guarantee there are no mistakes in the route?

    enter image description here

    Also you can try with this import import { VueI18n } from "/Users/scott/Desktop/Pando/uikit-main/node_modules/vue-i18n/dist/vue-i18n" instead VueI18n from 'vue-i18n'