feat: on-the-fly template compilation

diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts
index 5802549c486f0cd07cbf06cb2c0696f28fd64306..cf79af418319de2464792338e431188490d0f195 100644 (file)
--- a/packages/runtime-core/src/component.ts
+++ b/packages/runtime-core/src/component.ts
@@ -298,12 +298,28 @@ export function handleSetupResult(
   finishComponentSetup(instance, parentSuspense)
 }
 
+let compile: Function | undefined
+export function registerCompiler(_compile: Function) {
+  compile = _compile
+}
+
 function finishComponentSetup(
   instance: ComponentInternalInstance,
   parentSuspense: SuspenseBoundary | null
 ) {
   const Component = instance.type as ComponentOptions
   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) {
       warn(
         `Component is missing render function. Either provide a template or ` +

diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index d39d3083eee83abe7a719fa02f0f51e2225220a4..cd81043faa4fac88ede486fb3d4730e41059f1b1 100644 (file)
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -35,10 +35,13 @@ export {
   callWithAsyncErrorHandling
 } from './errorHandling'
 
-// For compiler generated code
+// Internal, for compiler generated code
 export { applyDirectives } from './directives'
 export { resolveComponent, resolveDirective } from './componentOptions'
 
+// Internal, for integration with runtime compiler
+export { registerCompiler } from './component'
+
 // Types -----------------------------------------------------------------------
 
 export { App, AppConfig, AppContext, Plugin } from './apiApp'

diff --git a/packages/vue/src/index.ts b/packages/vue/src/index.ts
index 5db370eb7f77a67cf0dae8b99cf0849fefd94b6f..7635080ad53c87bbbb7a89bcdae237564a8ecdad 100644 (file)
--- a/packages/vue/src/index.ts
+++ b/packages/vue/src/index.ts
@@ -1,16 +1,15 @@
 // 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.
-
-// TODO hook up the runtime to compile templates on the fly
-
+// and the compiler, and supports on-the-fly compilation of the template option.
 import { compile as baseCompile, CompilerOptions } from '@vue/compiler-dom'
+import { registerCompiler } from '@vue/runtime-dom'
 
 export function compile(template: string, options?: CompilerOptions): Function {
   const { code } = baseCompile(template, options)
   return new Function(`with(this){return ${code}}`)
 }
 
+registerCompiler(compile)
+
 export * from '@vue/runtime-dom'
 
 if (__BROWSER__ && __DEV__) {