The Vue3-mq plugin apparently supports TypeScript, but I don't seem to be able to actually use the types in a Vue3 app.
We are installing the plugin in the "standard" way (according to the docs) and are injecting mq into SFC components like this inject: ['mq']
, which works as expected.
However, we have TypeScript errors everywhere we are using it in a script block, e.g if we try to do this if (this.mq.smMinus) { ... }
then we see a TypeScript error under smMinus
that says "property smMinus does not exist on type unknown".
As mq
becomes a property of this
inside SFC files, I have tried adding the types to our env.d.ts file where we declare some other types under ComponentCustomProperties
. These are some of the ways of importing the types I have tried:
import {Vue3Mq} from 'vue3-mq';
import {Vue3Mq} from 'vue3-mq/types';
import Vue3Mq from 'vue3-mq';
import Vue3Mq from 'vue3-mq/types';
import type Vue3Mq from 'vue3-mq';
import type Vue3Mq from 'vue3-mq/types';
import * as Vue3Mq from 'vue3-mq';
import * as Vue3Mq from 'vue3-mq/types';
None of these work (and I've tried all these variations with other things like import mq from 'vue3-mq'
and import useMq from 'vue3-mq'
), in that, if I hover over the imported token, it does not show me any type information at all for the plugin.
We are using other 3rd libs in the app without any problem at all. E.g, if I do this: import moment from 'moment';
, when I hover on the imported moment token, I can see the type definition for the moment
function, and when I use moment in an SFC file, I get full Intellisense for its methods.
How can I successfully import the types please? The absolute best I've been able to get is to type mq
as any
so that at least the errors in our SFC go away.