feat: diff with official vue-next

packages/runtime-core/src/apiAsyncComponent.ts

@@ -1,15 +1,18 @@
-import { isFunction } from '@vue/shared'
-import { ref } from '@vue/reactivity'
-import { defineComponent } from './apiDefineComponent'
 import {
   Component,
-  ComponentInternalInstance,
-  ComponentOptions,
   ConcreteComponent,
-  currentInstance
+  currentInstance,
+  ComponentInternalInstance,
+  isInSSRComponentSetup,
+  ComponentOptions
 } from './component'
+import { isFunction, isObject } from '@vue/shared'
 import { ComponentPublicInstance } from './componentPublicInstance'
 import { createVNode, VNode } from './vnode'
+import { defineComponent } from './apiDefineComponent'
+import { warn } from './warning'
+import { ref } from '@vue/reactivity'
+import { handleError, ErrorCodes } from './errorHandling'
 
 export type AsyncComponentResolveResult<T = Component> = T | { default: T } // es modules
 
@@ -32,7 +35,7 @@ export interface AsyncComponentOptions<T = any> {
   ) => any
 }
 
-export const isAsyncWrapper = (i: ComponentInternalInstance | VNode) =>
+export const isAsyncWrapper = (i: ComponentInternalInstance | VNode): boolean =>
   !!(i.type as ComponentOptions).__asyncLoader
 
 export function defineAsyncComponent<

packages/runtime-core/src/apiComputed.ts

@@ -1,9 +1,9 @@
 import {
   computed as _computed,
-  ComputedGetter,
   ComputedRef,
   WritableComputedOptions,
-  WritableComputedRef
+  WritableComputedRef,
+  ComputedGetter
 } from '@vue/reactivity'
 import { recordInstanceBoundEffect } from './component'
 

packages/runtime-core/src/apiCreateApp.ts

@@ -1,19 +1,19 @@
-import { NO, isObject, isFunction } from '@vue/shared'
-import { InjectionKey } from './apiInject'
 import {
-  Component,
   ConcreteComponent,
   Data,
-  validateComponentName
+  validateComponentName,
+  Component
 } from './component'
 import { ComponentOptions } from './componentOptions'
 import { ComponentPublicInstance } from './componentPublicInstance'
 import { Directive, validateDirectiveName } from './directives'
-import { RootHydrateFunction } from './hydration'
 import { RootRenderFunction } from './renderer'
+import { InjectionKey } from './apiInject'
+import { isFunction, NO, isObject } from '@vue/shared'
+import { warn } from './warning'
 import { createVNode, cloneVNode, VNode } from './vnode'
+import { RootHydrateFunction } from './hydration'
 import { devtoolsInitApp, devtoolsUnmountApp } from './devtools'
-import { warn } from './warning'
 import { version } from '.'
 
 export interface App<HostElement = any> {
@@ -285,7 +285,7 @@ export function createAppAPI<HostElement>(
           if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
             devtoolsUnmountApp(app)
           }
-        } else {
+        } else if (__DEV__) {
           warn(`Cannot unmount an app that is not mounted.`)
         }
       },

packages/runtime-core/src/apiDefineComponent.ts

@@ -1,18 +1,30 @@
-import { isFunction } from '@vue/shared'
-import { AllowedComponentProps, ComponentCustomProps } from './component'
-import { EmitsOptions } from './componentEmits'
 import {
-  ComponentOptionsBase,
-  ComponentOptionsMixin,
   ComputedOptions,
-  MethodOptions
+  MethodOptions,
+  ComponentOptionsWithoutProps,
+  ComponentOptionsWithArrayProps,
+  ComponentOptionsWithObjectProps,
+  ComponentOptionsMixin,
+  RenderFunction,
+  ComponentOptionsBase
 } from './componentOptions'
-import { ExtractDefaultPropTypes, ExtractPropTypes } from './componentProps'
 import {
-  ComponentPublicInstanceConstructor,
-  CreateComponentPublicInstance
-} from './componentPublicInstance'
+  SetupContext,
+  AllowedComponentProps,
+  ComponentCustomProps
+} from './component'
+import {
+  ExtractPropTypes,
+  ComponentPropsOptions,
+  ExtractDefaultPropTypes
+} from './componentProps'
+import { EmitsOptions } from './componentEmits'
+import { isFunction } from '@vue/shared'
 import { VNodeProps } from './vnode'
+import {
+  CreateComponentPublicInstance,
+  ComponentPublicInstanceConstructor
+} from './componentPublicInstance'
 
 export type PublicProps = VNodeProps &
   AllowedComponentProps &
@@ -61,6 +73,112 @@ export type DefineComponent<
   > &
   PP
 
+// defineComponent is a utility that is primarily used for type inference
+// when declaring components. Type inference is provided in the component
+// options (provided as the argument). The returned value has artificial types
+// for TSX / manual render function / IDE support.
+
+// overload 1: direct setup function
+// (uses user defined props interface)
+export function defineComponent<Props, RawBindings = object>(
+  setup: (
+    props: Readonly<Props>,
+    ctx: SetupContext
+  ) => RawBindings | RenderFunction
+): DefineComponent<Props, RawBindings>
+
+// overload 2: object format with no props
+// (uses user defined props interface)
+// return type is for Vetur and TSX support
+export function defineComponent<
+  Props = {},
+  RawBindings = {},
+  D = {},
+  C extends ComputedOptions = {},
+  M extends MethodOptions = {},
+  Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
+  Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
+  E extends EmitsOptions = EmitsOptions,
+  EE extends string = string
+>(
+  options: ComponentOptionsWithoutProps<
+    Props,
+    RawBindings,
+    D,
+    C,
+    M,
+    Mixin,
+    Extends,
+    E,
+    EE
+  >
+): DefineComponent<Props, RawBindings, D, C, M, Mixin, Extends, E, EE>
+
+// overload 3: object format with array props declaration
+// props inferred as { [key in PropNames]?: any }
+// return type is for Vetur and TSX support
+export function defineComponent<
+  PropNames extends string,
+  RawBindings,
+  D,
+  C extends ComputedOptions = {},
+  M extends MethodOptions = {},
+  Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
+  Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
+  E extends EmitsOptions = Record<string, any>,
+  EE extends string = string
+>(
+  options: ComponentOptionsWithArrayProps<
+    PropNames,
+    RawBindings,
+    D,
+    C,
+    M,
+    Mixin,
+    Extends,
+    E,
+    EE
+  >
+): DefineComponent<
+  Readonly<{ [key in PropNames]?: any }>,
+  RawBindings,
+  D,
+  C,
+  M,
+  Mixin,
+  Extends,
+  E,
+  EE
+>
+
+// overload 4: object format with object props declaration
+// see `ExtractPropTypes` in ./componentProps.ts
+export function defineComponent<
+  // the Readonly constraint allows TS to treat the type of { required: true }
+  // as constant instead of boolean.
+  PropsOptions extends Readonly<ComponentPropsOptions>,
+  RawBindings,
+  D,
+  C extends ComputedOptions = {},
+  M extends MethodOptions = {},
+  Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
+  Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
+  E extends EmitsOptions = Record<string, any>,
+  EE extends string = string
+>(
+  options: ComponentOptionsWithObjectProps<
+    PropsOptions,
+    RawBindings,
+    D,
+    C,
+    M,
+    Mixin,
+    Extends,
+    E,
+    EE
+  >
+): DefineComponent<PropsOptions, RawBindings, D, C, M, Mixin, Extends, E, EE>
+
 // implementation, close to no-op
 export function defineComponent(options: unknown) {
   return isFunction(options) ? { setup: options, name: options.name } : options

packages/runtime-core/src/apiLifecycle.ts

@@ -1,5 +1,3 @@
-import { DebuggerEvent, pauseTracking, resetTracking } from '@vue/reactivity'
-import { toHandlerKey } from '@vue/shared'
 import {
   ComponentInternalInstance,
   currentInstance,
@@ -10,6 +8,10 @@ import {
 import { ComponentPublicInstance } from './componentPublicInstance'
 import { callWithAsyncErrorHandling, ErrorTypeStrings } from './errorHandling'
 import { warn } from './warning'
+import { toHandlerKey } from '@vue/shared'
+import { DebuggerEvent, pauseTracking, resetTracking } from '@vue/reactivity'
+
+export { onActivated, onDeactivated } from './components/KeepAlive'
 
 export function injectHook(
   type: LifecycleHooks,
@@ -57,7 +59,6 @@ export function injectHook(
           : ``)
     )
   }
-  return
 }
 
 export const createHook = <T extends Function = () => any>(
@@ -70,7 +71,7 @@ export const onMounted = createHook(LifecycleHooks.MOUNTED)
 export const onBeforeUpdate = createHook(LifecycleHooks.BEFORE_UPDATE)
 export const onUpdated = createHook(LifecycleHooks.UPDATED)
 export const onBeforeUnmount = createHook(LifecycleHooks.BEFORE_UNMOUNT)
-export const onUnmount = createHook(LifecycleHooks.UNMOUNTED)
+export const onUnmounted = createHook(LifecycleHooks.UNMOUNTED)
 
 export type DebuggerHook = (e: DebuggerEvent) => void
 export const onRenderTriggered = createHook<DebuggerHook>(

packages/runtime-core/src/apiSetupHelpers.ts

@@ -1,7 +1,7 @@
 import {
-  createSetupContext,
   getCurrentInstance,
-  SetupContext
+  SetupContext,
+  createSetupContext
 } from './component'
 import { EmitFn, EmitsOptions } from './componentEmits'
 import { ComponentObjectPropsOptions, ExtractPropTypes } from './componentProps'

packages/runtime-core/src/apiWatch.ts

@@ -1,37 +1,38 @@
 import {
-  ComputedRef,
   effect,
-  isReactive,
+  stop,
   isRef,
-  ReactiveEffectOptions,
   Ref,
-  stop
+  ComputedRef,
+  ReactiveEffectOptions,
+  isReactive
 } from '@vue/reactivity'
+import { SchedulerJob, queuePreFlushCb } from './scheduler'
 import {
   EMPTY_OBJ,
-  hasChanged,
+  isObject,
   isArray,
   isFunction,
-  isObject,
-  isSet,
-  isMap,
+  isString,
+  hasChanged,
   NOOP,
   remove,
-  isString
+  isMap,
+  isSet
 } from '@vue/shared'
-import { warn } from './warning'
 import {
-  ComponentInternalInstance,
   currentInstance,
+  ComponentInternalInstance,
+  isInSSRComponentSetup,
   recordInstanceBoundEffect
 } from './component'
-import { queuePreFlushCb, SchedulerJob } from './scheduler'
 import {
-  callWithAsyncErrorHandling,
+  ErrorCodes,
   callWithErrorHandling,
-  ErrorCodes
+  callWithAsyncErrorHandling
 } from './errorHandling'
 import { queuePostRenderEffect } from './renderer'
+import { warn } from './warning'
 
 export type WatchEffect = (onInvalidate: InvalidateCbRegistrator) => void
 
@@ -269,6 +270,8 @@ function doWatch(
   }
   //
   // 6. scheduler 设置
+  // it is allowed to self-trigger (#1727)
+  job.allowRecurse = !!cb
   let scheduler: ReactiveEffectOptions['scheduler']
   // 6.1 flush is 'sync'，让依赖同步执行，即当值发生改变之后
   // 立即就会体现出来，因为依赖在赋值之后被立即执行了