import { createRenderer, createHydrationRenderer, warn, RootRenderFunction, CreateAppFunction, Renderer, HydrationRenderer, App, RootHydrateFunction } from '@vue/runtime-core' import { nodeOps } from './nodeOps' import { patchProp, forcePatchProp } from './patchProp' // Importing from the compiler, will be tree-shaken in prod import { isFunction, isString, isHTMLTag, isSVGTag, extend } from '@vue/shared' declare module '@vue/reactivity' { export interface RefUnwrapBailTypes { // Note: if updating this, also update `types/refBail.d.ts`. runtimeDOMBailTypes: Node | Window } } const rendererOptions = extend({ patchProp, forcePatchProp }, nodeOps) // lazy create the renderer - this makes core renderer logic tree-shakable // in case the user only imports reactivity utilities from Vue. let renderer: Renderer | HydrationRenderer let enabledHydration = false function ensureRenderer() { return renderer || (renderer = createRenderer(rendererOptions)) } function ensureHydrationRenderer() { renderer = enabledHydration ? renderer : createHydrationRenderer(rendererOptions) enabledHydration = true return renderer as HydrationRenderer } // use explicit type casts here to avoid import() calls in rolled-up d.ts export const render = ((...args) => { ensureRenderer().render(...args) }) as RootRenderFunction export const hydrate = ((...args) => { ensureHydrationRenderer().hydrate(...args) }) as RootHydrateFunction export const createApp = ((...args) => { const app = ensureRenderer().createApp(...args) if (__DEV__) { injectNativeTagCheck(app) } const { mount } = app app.mount = (containerOrSelector: Element | string): any => { const container = normalizeContainer(containerOrSelector) if (!container) return const component = app._component if (!isFunction(component) && !component.render && !component.template) { component.template = container.innerHTML } // clear content before mounting container.innerHTML = '' const proxy = mount(container) container.removeAttribute('v-cloak') return proxy } return app }) as CreateAppFunction export const createSSRApp = ((...args) => { const app = ensureHydrationRenderer().createApp(...args) if (__DEV__) { injectNativeTagCheck(app) } const { mount } = app app.mount = (containerOrSelector: Element | string): any => { const container = normalizeContainer(containerOrSelector) if (container) { return mount(container, true) } } return app }) as CreateAppFunction function injectNativeTagCheck(app: App) { // Inject `isNativeTag` // this is used for component name validation (dev only) Object.defineProperty(app.config, 'isNativeTag', { value: (tag: string) => isHTMLTag(tag) || isSVGTag(tag), writable: false }) } function normalizeContainer(container: Element | string): Element | null { if (isString(container)) { const res = document.querySelector(container) if (__DEV__ && !res) { warn(`Failed to mount app: mount target selector returned null.`) } return res } return container } // SFC CSS utilities export { useCSSModule } from './helpers/useCssModule' export { useCSSVars } from './helpers/useCssVars' // DOM-only components export { Transition, TransitionProps } from './components/Transition' export { TransitionGroup, TransitionGroupProps } from './components/TransitionGroup' // **Internal** DOM-only runtime directive helpers export { vModelText, vModelCheckbox, vModelRadio, vModelSelect, vModelDynamic } from './directives/vModel' export { withModifiers, withKeys } from './directives/vOn' export { vShow } from './directives/vShow' // re-export everything from core // h, Component, reactivity API, nextTick, flags & types export * from '@vue/runtime-core'