title: Vue 3 Inject Plugin with Composition API and TypeScript
body: <p>I created a <code>controller</code> plugin to be used global in every component, but I can't make it work with Vue 3 + TypeScript + Composition API I get a TypeScript error</p>
  <p><strong>ui/plugins/controllers.ts</strong></p>
  <pre><code>import { App } from 'vue'
  import { provider, IProvider } from '@/core/presentation/provider'
  
  export default {
    install: (app: App) =&gt; {
      const controllers: IProvider = provider()
      app.provide('controllers', controllers)
    }
  }
  </code></pre>
  <p><strong>main.ts</strong></p>
  <pre><code>import { createApp } from 'vue'
  import { controllers } from './ui'
  
  createApp(App)
    .use(controllers)
    .mount('#app')
  </code></pre>
  <p><strong>@/core/presentation/provider/provider.ts</strong></p>
  <pre><code>import { UserController } from '../controllers'
  import { IProvider } from './provider.types'
  
  export const provider = (): IProvider =&gt; ({
    users: new UserController()
  })
  </code></pre>
  <p><strong>ui/views/Component.vue</strong></p>
  <pre><code>import { onMounted, ref, inject, defineComponent } from 'vue'
  
  export default defineComponent({
    setup() {
      const controllers = inject('controllers')
  
      const user = ref()
      const getUser = async () =&gt; {
        const result = await controllers.users.getById(1)
        if (result) {
          user.value = result.toJson()
        }
      }
  
      onMounted(getUser)
  
      return {
        user,
        getUser
      }
    }
  })
  </code></pre>
  <p>Here I get a typescript error when I try to use the controller at this line</p>
  <pre><code>const result = await controllers.users.getById(1)
  </code></pre>
  <p>Error:</p>
  <blockquote>
  <pre><code>const controllers: unknown
  Object is of type 'unknown'.Vetur(2571)
  </code></pre>
  </blockquote>
  <p>If I set the type with my interface like this I get another typescript error</p>
  <pre><code>import { IProvider } from '@/core'
  ...
  const controllers: IProvider  = inject('controllers')
  </code></pre>
  <p>Error:</p>
  <blockquote>
  <pre><code>type 'IProvider | undefined' is not assignable to type 'IProvider'.
  Type 'undefined' is not assignable to type 'IProvider'.Vetur(2322)
  </code></pre>
  </blockquote>
  <p>I can only make it work like this but I think it's weird:</p>
  <pre><code>const controllers: IProvider | undefined = inject('controllers')
  ...
  const result = await controllers?.users.getById(1)
  </code></pre>