diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts index 406e8e0e4f6..9b142036219 100644 --- a/packages/runtime-core/src/component.ts +++ b/packages/runtime-core/src/component.ts @@ -653,6 +653,9 @@ type CompileFunction = ( let compile: CompileFunction | undefined +// dev only +export const isRuntimeOnly = () => !compile + /** * For runtime-dom to register the compiler. * Note the exported method uses any to avoid d.ts relying on the compiler types. diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts index 818caa597e6..a24672226db 100644 --- a/packages/runtime-core/src/index.ts +++ b/packages/runtime-core/src/index.ts @@ -87,7 +87,7 @@ export { resolveDynamicComponent } from './helpers/resolveAssets' // For integration with runtime compiler -export { registerRuntimeCompiler } from './component' +export { registerRuntimeCompiler, isRuntimeOnly } from './component' export { useTransitionState, resolveTransitionHooks, diff --git a/packages/runtime-dom/src/index.ts b/packages/runtime-dom/src/index.ts index 027bef11be7..8a66ec994c9 100644 --- a/packages/runtime-dom/src/index.ts +++ b/packages/runtime-dom/src/index.ts @@ -7,7 +7,8 @@ import { Renderer, HydrationRenderer, App, - RootHydrateFunction + RootHydrateFunction, + isRuntimeOnly } from '@vue/runtime-core' import { nodeOps } from './nodeOps' import { patchProp, forcePatchProp } from './patchProp' @@ -55,6 +56,7 @@ export const createApp = ((...args) => { if (__DEV__) { injectNativeTagCheck(app) + injectCustomElementCheck(app) } const { mount } = app @@ -83,6 +85,7 @@ export const createSSRApp = ((...args) => { if (__DEV__) { injectNativeTagCheck(app) + injectCustomElementCheck(app) } const { mount } = app @@ -105,6 +108,25 @@ function injectNativeTagCheck(app: App) { }) } +// dev only +function injectCustomElementCheck(app: App) { + if (isRuntimeOnly()) { + const value = app.config.isCustomElement + Object.defineProperty(app.config, 'isCustomElement', { + get() { + return value + }, + set() { + warn( + `The \`isCustomElement\` config option is only respected when using the runtime compiler.` + + `If you are using the runtime-only build, \`isCustomElement\` must be passed to \`@vue/compiler-dom\` in the build setup instead` + + `- for example, via the \`compilerOptions\` option in vue-loader: https://vue-loader.vuejs.org/options.html#compileroptions.` + ) + } + }) + } +} + function normalizeContainer( container: Element | ShadowRoot | string ): Element | null {