wip: whitespace behavior compat
This commit is contained in:
		
							parent
							
								
									091e6d67bf
								
							
						
					
					
						commit
						5913e01d6b
					
				@ -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. ` +
 | 
			
		||||
 | 
			
		||||
@ -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' &&
 | 
			
		||||
        !(key === 'isCustomElement' && isRuntimeOnly())
 | 
			
		||||
        isRuntimeOnly() &&
 | 
			
		||||
        (key === 'isCustomElement' || key === 'compilerOptions')
 | 
			
		||||
      ) {
 | 
			
		||||
        continue
 | 
			
		||||
      }
 | 
			
		||||
      // @ts-ignore
 | 
			
		||||
      app.config[key] = singletonApp.config[key]
 | 
			
		||||
    }
 | 
			
		||||
    }
 | 
			
		||||
    isCopyingConfig = false
 | 
			
		||||
 | 
			
		||||
    // copy prototype augmentations as config.globalProperties
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										46
									
								
								packages/vue-compat/src/createCompatVue.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										46
									
								
								packages/vue-compat/src/createCompatVue.ts
									
									
									
									
									
										Normal file
									
								
							@ -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
 | 
			
		||||
}
 | 
			
		||||
@ -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'
 | 
			
		||||
 | 
			
		||||
if (__DEV__) {
 | 
			
		||||
  initDev()
 | 
			
		||||
}
 | 
			
		||||
import {
 | 
			
		||||
  DeprecationTypes,
 | 
			
		||||
  warnDeprecation
 | 
			
		||||
} 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
 | 
			
		||||
 | 
			
		||||
@ -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 {
 | 
			
		||||
  compatUtils,
 | 
			
		||||
  createApp,
 | 
			
		||||
  warn,
 | 
			
		||||
  Transition,
 | 
			
		||||
  TransitionGroup,
 | 
			
		||||
  KeepAlive,
 | 
			
		||||
  DeprecationTypes,
 | 
			
		||||
  vShow,
 | 
			
		||||
  vModelDynamic
 | 
			
		||||
} from '@vue/runtime-dom'
 | 
			
		||||
import { extend } from '@vue/shared'
 | 
			
		||||
import { createCompatVue } from './createCompatVue'
 | 
			
		||||
import { warn } from '@vue/runtime-core'
 | 
			
		||||
 | 
			
		||||
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
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const Vue = compatUtils.createCompatVue(wrappedCreateApp)
 | 
			
		||||
const Vue = createCompatVue()
 | 
			
		||||
 | 
			
		||||
Vue.compile = (() => {
 | 
			
		||||
  if (__DEV__) {
 | 
			
		||||
@ -55,9 +20,4 @@ Vue.compile = (() => {
 | 
			
		||||
  }
 | 
			
		||||
}) as any
 | 
			
		||||
 | 
			
		||||
extend(Vue, runtimeDom)
 | 
			
		||||
 | 
			
		||||
// @ts-ignore
 | 
			
		||||
Vue.createApp = wrappedCreateApp
 | 
			
		||||
 | 
			
		||||
export default Vue
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user