feat: on-the-fly template compilation

This commit is contained in:
Evan You 2019-09-20 00:24:16 -04:00
parent d7aab859a3
commit 3ddd121b19
3 changed files with 24 additions and 6 deletions

View File

@ -298,12 +298,28 @@ export function handleSetupResult(
finishComponentSetup(instance, parentSuspense) finishComponentSetup(instance, parentSuspense)
} }
let compile: Function | undefined
export function registerCompiler(_compile: Function) {
compile = _compile
}
function finishComponentSetup( function finishComponentSetup(
instance: ComponentInternalInstance, instance: ComponentInternalInstance,
parentSuspense: SuspenseBoundary | null parentSuspense: SuspenseBoundary | null
) { ) {
const Component = instance.type as ComponentOptions const Component = instance.type as ComponentOptions
if (!instance.render) { if (!instance.render) {
if (Component.template && !Component.render) {
if (compile) {
Component.render = compile(Component.template)
} else if (__DEV__) {
warn(
`Component provides template but the build of Vue you are running ` +
`does not support on-the-fly template compilation. Either use the ` +
`full build or pre-compile the template using Vue CLI.`
)
}
}
if (__DEV__ && !Component.render) { if (__DEV__ && !Component.render) {
warn( warn(
`Component is missing render function. Either provide a template or ` + `Component is missing render function. Either provide a template or ` +

View File

@ -35,10 +35,13 @@ export {
callWithAsyncErrorHandling callWithAsyncErrorHandling
} from './errorHandling' } from './errorHandling'
// For compiler generated code // Internal, for compiler generated code
export { applyDirectives } from './directives' export { applyDirectives } from './directives'
export { resolveComponent, resolveDirective } from './componentOptions' export { resolveComponent, resolveDirective } from './componentOptions'
// Internal, for integration with runtime compiler
export { registerCompiler } from './component'
// Types ----------------------------------------------------------------------- // Types -----------------------------------------------------------------------
export { App, AppConfig, AppContext, Plugin } from './apiApp' export { App, AppConfig, AppContext, Plugin } from './apiApp'

View File

@ -1,16 +1,15 @@
// This package is the "full-build" that includes both the runtime // This package is the "full-build" that includes both the runtime
// and the compiler. For now we are just exporting everything from the runtome // and the compiler, and supports on-the-fly compilation of the template option.
// AND the compiler.
// TODO hook up the runtime to compile templates on the fly
import { compile as baseCompile, CompilerOptions } from '@vue/compiler-dom' import { compile as baseCompile, CompilerOptions } from '@vue/compiler-dom'
import { registerCompiler } from '@vue/runtime-dom'
export function compile(template: string, options?: CompilerOptions): Function { export function compile(template: string, options?: CompilerOptions): Function {
const { code } = baseCompile(template, options) const { code } = baseCompile(template, options)
return new Function(`with(this){return ${code}}`) return new Function(`with(this){return ${code}}`)
} }
registerCompiler(compile)
export * from '@vue/runtime-dom' export * from '@vue/runtime-dom'
if (__BROWSER__ && __DEV__) { if (__BROWSER__ && __DEV__) {