wip: more compat progress

packages/vue-compat/src/index.ts

@@ -2,16 +2,11 @@
 // and the compiler, and supports on-the-fly compilation of the template option.
 import { initDev } from './dev'
 import { compile, CompilerError, CompilerOptions } from '@vue/compiler-dom'
-import {
-  registerRuntimeCompiler,
-  RenderFunction,
-  warn,
-  createApp,
-  compatUtils
-} from '@vue/runtime-dom'
+import { registerRuntimeCompiler, RenderFunction, warn } from '@vue/runtime-dom'
 import { isString, NOOP, generateCodeFrame, extend } from '@vue/shared'
 import { InternalRenderFunction } from 'packages/runtime-core/src/component'
 import * as runtimeDom from '@vue/runtime-dom'
+import Vue from './runtime'
 
 if (__DEV__) {
   initDev()
@@ -92,10 +87,6 @@ function compileToFunction(
 
 registerRuntimeCompiler(compileToFunction)
 
-const Vue = compatUtils.createCompatVue(createApp)
-
 Vue.compile = compileToFunction
 
-extend(Vue, runtimeDom)
-
 export default Vue

packages/vue-compat/src/runtime.ts

@@ -1,7 +1,17 @@
 // This entry exports the runtime only, and is built as
 // `dist/vue.esm-bundler.js` which is used by default for bundlers.
 import { initDev } from './dev'
-import { compatUtils, createApp, warn } from '@vue/runtime-dom'
+import {
+  compatUtils,
+  createApp,
+  warn,
+  Transition,
+  TransitionGroup,
+  KeepAlive,
+  DeprecationTypes,
+  vShow,
+  vModelDynamic
+} from '@vue/runtime-dom'
 import { extend } from '@vue/shared'
 
 if (__DEV__) {
@@ -10,7 +20,25 @@ if (__DEV__) {
 
 import * as runtimeDom from '@vue/runtime-dom'
 
-const Vue = compatUtils.createCompatVue(createApp)
+function wrappedCreateApp(...args: any[]) {
+  // @ts-ignore
+  const app = createApp(...args)
+  if (compatUtils.isCompatEnabled(DeprecationTypes.RENDER_FUNCTION, null)) {
+    // register built-in components so that they can be resolved via strings
+    // in the legacy h() call. The __compat__ prefix is to ensure that v3 h()
+    // doesn't get affected.
+    app.component('__compat__transition', Transition)
+    app.component('__compat__transition-group', TransitionGroup)
+    app.component('__compat__keep-alive', KeepAlive)
+    // built-in directives. No need for prefix since there's no render fn API
+    // for resolving directives via string in v3.
+    app._context.directives.show = vShow
+    app._context.directives.model = vModelDynamic
+  }
+  return app
+}
+
+const Vue = compatUtils.createCompatVue(wrappedCreateApp)
 
 Vue.compile = (() => {
   if (__DEV__) {
@@ -29,4 +57,7 @@ Vue.compile = (() => {
 
 extend(Vue, runtimeDom)
 
+// @ts-ignore
+Vue.createApp = wrappedCreateApp
+
 export default Vue