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_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. ` +
|
||||||
|
@ -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
|
||||||
|
|
||||||
|
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
|
// 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
|
||||||
|
@ -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
|
||||||
|
Loading…
Reference in New Issue
Block a user