Explorar o código

feat: on-the-fly template compilation

Evan You %!s(int64=6) %!d(string=hai) anos
pai
achega
3ddd121b19

+ 16 - 0
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 ` +

+ 4 - 1
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'

+ 4 - 5
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__) {