types: Added stricter type checking for plugin use

Author: candy-Tong

packages/runtime-core/__tests__/apiCreateApp.spec.ts

@@ -11,7 +11,8 @@ import {
   Plugin,
   ref,
   getCurrentInstance,
-  defineComponent
+  defineComponent,
+  App
 } from '@vue/runtime-test'
 
 describe('api: createApp', () => {
@@ -273,12 +274,12 @@ describe('api: createApp', () => {
 
   test('use', () => {
     const PluginA: Plugin = app => app.provide('foo', 1)
-    const PluginB: Plugin = {
-      install: (app, arg1, arg2) => app.provide('bar', arg1 + arg2)
+    const PluginB = {
+      install: (app: App, arg1: number, arg2: number) => app.provide('bar', arg1 + arg2)
     }
     class PluginC {
       someProperty = {}
-      static install() {
+      static install(app: App) {
         app.provide('baz', 2)
       }
     }

packages/runtime-core/src/apiCreateApp.ts

@@ -28,7 +28,7 @@ import { ObjectEmitsOptions } from './componentEmits'
 export interface App<HostElement = any> {
   version: string
   config: AppConfig
-  use(plugin: Plugin, ...options: any[]): this
+  use<T extends Plugin>(plugin: T, ...options: ExtractPluginArg<T>): this
   mixin(mixin: ComponentOptions): this
   component(name: string): Component | undefined
   component(name: string, component: Component): this
@@ -139,12 +139,18 @@ export interface AppContext {
 
 type PluginInstallFunction = (app: App, ...options: any[]) => any
 
-export type Plugin =
-  | (PluginInstallFunction & { install?: PluginInstallFunction })
+export type Plugin<T extends PluginInstallFunction = PluginInstallFunction> =
+  | (T & { install?: T })
   | {
-      install: PluginInstallFunction
+      install: T
     }
 
+export type ExtractPluginArg<T> = T extends Plugin<infer R>
+    ? R extends (app: App, ...arg: infer S) => any
+        ? S
+        : never
+    : never;
+
 export function createAppContext(): AppContext {
   return {
     app: null as any,
@@ -215,7 +221,7 @@ export function createAppAPI<HostElement>(
         }
       },
 
-      use(plugin: Plugin, ...options: any[]) {
+      use<T extends Plugin>(plugin: T, ...options: ExtractPluginArg<T>) {
         if (installedPlugins.has(plugin)) {
           __DEV__ && warn(`Plugin has already been applied to target app.`)
         } else if (plugin && isFunction(plugin.install)) {

packages/runtime-core/src/compat/global.ts

@@ -23,6 +23,7 @@ import {
   AppConfig,
   AppContext,
   CreateAppFunction,
+  ExtractPluginArg,
   Plugin
 } from '../apiCreateApp'
 import {
@@ -77,7 +78,7 @@ export type CompatVue = Pick<App, 'version' | 'component' | 'directive'> & {
 
   nextTick: typeof nextTick
 
-  use(plugin: Plugin, ...options: any[]): CompatVue
+  use<T extends Plugin>(plugin: T, ...options: ExtractPluginArg<T>): CompatVue
   mixin(mixin: ComponentOptions): CompatVue
 
   component(name: string): Component | undefined

packages/runtime-core/src/index.ts

@@ -189,7 +189,8 @@ export {
   AppContext,
   Plugin,
   CreateAppFunction,
-  OptionMergeFunction
+  OptionMergeFunction,
+  ExtractPluginArg
 } from './apiCreateApp'
 export {
   VNode,