How to Vue.use() a javascript plugin in a TypeScript project that does have typings - Stack Overflow

I am trying to use Semantic-UI-Vue in my vue project. However, I am getting the following error when I try and do Vue.use(SuiVue):

Argument of type 'typeof import("semantic-ui-vue")' is not assignable to parameter of type 'PluginObject<{}> | PluginFunction<{}>'.\n Type 'typeof import("semantic-ui-vue")' is not assignable to type 'PluginFunction<{}>'.\n Type 'typeof import("semantic-ui-vue")' provides no match for the signature '(Vue: VueConstructor, options?: {} | undefined): void'."

I have created a .d.ts file that lets me import SuiVue:

declare module 'semantic-ui-vue'{}

And I import it in my app.ts as:

import * as SuiVue from 'semantic-ui-vue';

What do I need to do to get this plugin to be usable in a typescript project without disabling global TypeScript settings like noImplicitAny?

I am trying to use Semantic-UI-Vue in my vue project. However, I am getting the following error when I try and do Vue.use(SuiVue):

Argument of type 'typeof import("semantic-ui-vue")' is not assignable to parameter of type 'PluginObject<{}> | PluginFunction<{}>'.\n Type 'typeof import("semantic-ui-vue")' is not assignable to type 'PluginFunction<{}>'.\n Type 'typeof import("semantic-ui-vue")' provides no match for the signature '(Vue: VueConstructor, options?: {} | undefined): void'."

I have created a .d.ts file that lets me import SuiVue:

declare module 'semantic-ui-vue'{}

And I import it in my app.ts as:

import * as SuiVue from 'semantic-ui-vue';

What do I need to do to get this plugin to be usable in a typescript project without disabling global TypeScript settings like noImplicitAny?

• javascript
• typescript
• vue.js
• vuejs2
• semantic-ui

Share Improve this question Follow edited Jan 25, 2019 at 1:11 Douglas Gaskell asked Jan 25, 2019 at 0:58 Douglas GaskellDouglas Gaskell 10.2k1212 gold badges8181 silver badges135135 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

Replace declare module 'semantic-ui-vue'{} with declare module 'semantic-ui-vue';

---

declare module 'semantic-ui-vue'{} means the module have the type of an empty object {}.

declare module 'semantic-ui-vue'; means the module have the type any

see Shorthand ambient modules in https://www.typescriptlang/docs/handbook/modules.html

---

As the OP has figured out, you need to change the import statement to import SuiVue from 'semantic-ui-vue'; for it to work