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_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. ` +

View File

@ -141,13 +141,15 @@ 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')
) {
// @ts-ignore
app.config[key] = singletonApp.config[key]
continue
}
// @ts-ignore
app.config[key] = singletonApp.config[key]
}
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
// 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

View File

@ -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