How to solve boot file Error with boot.d.ts?

[Xillis_Wu]

Hi, I'm learning Typescript from Quasar, but I have a question.

In boot files, there would be an error

And I found there is a file called boot.d.ts in @quasar/app/types/boot.d.ts.

My question is how can I combine them to solve this problem?

// src/boot/i18n.ts

export default ({ app }) => {
  app.i18n = i18n // `Error:(13, 19) TS7031: Binding element 'app' implicitly has an 'any' type.`.
}

[Nguyễn Đức Tâm]

You can try to add this lines in the head of file i18n.ts:
import Vue from 'vue';
import VueI18n from 'vue-i18n';

declare module 'vue/types/vue' {
interface Vue {
i18n: VueI18n;
}
}
i18n = new VueI18n({ ... });

...

[Kerry]

@FPNL the typescript extension is currently in the process of being replaced by an update to the Quasar starter that includes typescript as an option as part of the initial project creation.

Please join us on the Typescript channel of the Quasar discord server. You will find some early versions of the starter posted (although at the moment not working, should be resolved soon) there that might be helpful.

The specific issue that you are seeing is caused by the bootfile parameters not including a specific type declaration. If you are using a newer version of quasar you can resolve that error by replacing the i18n boot file contents with

import { boot } from 'quasar/wrappers';
import messages from 'src/i18n';
import Vue from 'vue';
import VueI18n from 'vue-i18n';

declare module 'vue/types/vue' {
  interface Vue {
    i18n: VueI18n;
  }
}

Vue.use(VueI18n);

export const i18n = new VueI18n({
  locale: 'en-us',
  fallbackLocale: 'en-us',
  messages
});

export default boot(({ app }) => {
  // Set i18n instance on app
  app.i18n = i18n;
});