wip: whitespace behavior compat

This commit is contained in:
Evan You 2021-04-26 12:21:36 -04:00
parent 091e6d67bf
commit 5913e01d6b
5 changed files with 76 additions and 53 deletions

View File

@ -24,6 +24,7 @@ export const enum DeprecationTypes {
CONFIG_KEY_CODES = 'CONFIG_KEY_CODES', CONFIG_KEY_CODES = 'CONFIG_KEY_CODES',
CONFIG_PRODUCTION_TIP = 'CONFIG_PRODUCTION_TIP', CONFIG_PRODUCTION_TIP = 'CONFIG_PRODUCTION_TIP',
CONFIG_IGNORED_ELEMENTS = 'CONFIG_IGNORED_ELEMENTS', CONFIG_IGNORED_ELEMENTS = 'CONFIG_IGNORED_ELEMENTS',
CONFIG_WHITESPACE = 'CONFIG_WHITESPACE',
INSTANCE_SET = 'INSTANCE_SET', INSTANCE_SET = 'INSTANCE_SET',
INSTANCE_DELETE = 'INSTANCE_DELETE', 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` 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]: { [DeprecationTypes.INSTANCE_SET]: {
message: message:
`vm.$set() has been removed as it is no longer needed in Vue 3. ` + `vm.$set() has been removed as it is no longer needed in Vue 3. ` +

View File

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

View 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
}

View File

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

View File

@ -1,44 +1,9 @@
// This entry exports the runtime only, and is built as // This entry exports the runtime only, and is built as
// `dist/vue.esm-bundler.js` which is used by default for bundlers. // `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 = (() => { Vue.compile = (() => {
if (__DEV__) { if (__DEV__) {
@ -55,9 +20,4 @@ Vue.compile = (() => {
} }
}) as any }) as any
extend(Vue, runtimeDom)
// @ts-ignore
Vue.createApp = wrappedCreateApp
export default Vue export default Vue