wip: whitespace behavior compat

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

@@ -24,6 +24,7 @@ export const enum DeprecationTypes {
   CONFIG_KEY_CODES = 'CONFIG_KEY_CODES',
   CONFIG_PRODUCTION_TIP = 'CONFIG_PRODUCTION_TIP',
   CONFIG_IGNORED_ELEMENTS = 'CONFIG_IGNORED_ELEMENTS',
+  CONFIG_WHITESPACE = 'CONFIG_WHITESPACE',
 
   INSTANCE_SET = 'INSTANCE_SET',
   INSTANCE_DELETE = 'INSTANCE_DELETE',
@@ -162,6 +163,15 @@ const deprecationData: Record<DeprecationTypes, DeprecationData> = {
     link: `https://v3.vuejs.org/guide/migration/global-api.html#config-ignoredelements-is-now-config-iscustomelement`
   },
 
+  [DeprecationTypes.CONFIG_WHITESPACE]: {
+    // this warning is only relevant in the full build when using runtime
+    // compilation, so it's put in the runtime compatConfig list.
+    message:
+      `Vue 3 compiler's whitespace option will default to "condense" instead of ` +
+      `"preserve". To suppress this warning, provide an explicit value for ` +
+      `\`config.compilerOptions.whitespace\`.`
+  },
+
   [DeprecationTypes.INSTANCE_SET]: {
     message:
       `vm.$set() has been removed as it is no longer needed in Vue 3. ` +

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

@@ -141,14 +141,16 @@ export function createCompatVue(
     // copy over global config mutations
     isCopyingConfig = true
     for (const key in singletonApp.config) {
+      if (key === 'isNativeTag') continue
       if (
-        key !== 'isNativeTag' &&
+        isRuntimeOnly() &&
-        !(key === 'isCustomElement' && isRuntimeOnly())
+        (key === 'isCustomElement' || key === 'compilerOptions')
       ) {
+        continue
+      }
       // @ts-ignore
       app.config[key] = singletonApp.config[key]
     }
-    }
     isCopyingConfig = false
 
     // copy prototype augmentations as config.globalProperties

packages/vue-compat/src/createCompatVue.ts

@@ -0,0 +1,46 @@
+// 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,
+  Transition,
+  TransitionGroup,
+  KeepAlive,
+  DeprecationTypes,
+  vShow,
+  vModelDynamic
+} from '@vue/runtime-dom'
+import { extend } from '@vue/shared'
+
+if (__DEV__) {
+  initDev()
+}
+
+import * as runtimeDom from '@vue/runtime-dom'
+
+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
+}
+
+export function createCompatVue() {
+  const Vue = compatUtils.createCompatVue(wrappedCreateApp)
+  extend(Vue, runtimeDom)
+  // @ts-ignore
+  Vue.createApp = wrappedCreateApp
+  return Vue
+}

packages/vue-compat/src/index.ts

@@ -1,16 +1,15 @@
 // This entry is the "full-build" that includes both the runtime
 // and the compiler, and supports on-the-fly compilation of the template option.
-import { initDev } from './dev'
+import { createCompatVue } from './createCompatVue'
 import { compile, CompilerError, CompilerOptions } from '@vue/compiler-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'
+import {
-
+  DeprecationTypes,
-if (__DEV__) {
+  warnDeprecation
-  initDev()
+} from '../../runtime-core/src/compat/compatConfig'
-}
 
 const compileCache: Record<string, RenderFunction> = Object.create(null)
 
@@ -45,11 +44,16 @@ function compileToFunction(
     template = el ? el.innerHTML : ``
   }
 
+  if (__DEV__ && !__TEST__ && (!options || !options.whitespace)) {
+    warnDeprecation(DeprecationTypes.CONFIG_WHITESPACE, null)
+  }
+
   const { code } = compile(
     template,
     extend(
       {
         hoistStatic: true,
+        whitespace: 'preserve',
         onError: __DEV__ ? onError : undefined,
         onWarn: __DEV__ ? e => onError(e, true) : NOOP
       } as CompilerOptions,
@@ -87,6 +91,7 @@ function compileToFunction(
 
 registerRuntimeCompiler(compileToFunction)
 
+const Vue = createCompatVue()
 Vue.compile = compileToFunction
 
 export default Vue

packages/vue-compat/src/runtime.ts

@@ -1,44 +1,9 @@
 // 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 { createCompatVue } from './createCompatVue'
-import {
+import { warn } from '@vue/runtime-core'
-  compatUtils,
-  createApp,
-  warn,
-  Transition,
-  TransitionGroup,
-  KeepAlive,
-  DeprecationTypes,
-  vShow,
-  vModelDynamic
-} from '@vue/runtime-dom'
-import { extend } from '@vue/shared'
 
-if (__DEV__) {
+const Vue = createCompatVue()
-  initDev()
-}
-
-import * as runtimeDom from '@vue/runtime-dom'
-
-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__) {
@@ -55,9 +20,4 @@ Vue.compile = (() => {
   }
 }) as any
 
-extend(Vue, runtimeDom)
-
-// @ts-ignore
-Vue.createApp = wrappedCreateApp
-
 export default Vue