feat(playground): use vapor compiler (#109)

* feat(playground): use vapor compiler

* chore: update VRT snapshots

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

Author: ubugeeei

Cargo.lock

@@ -521,6 +521,7 @@ fn compile_file_with_profile(
             scoped: has_scoped,
             ..Default::default()
         },
+        vapor: false,
         scope_id: None,
     };
 

crates/vize/src/commands/build/runner.rs

@@ -14,6 +14,7 @@ mod tests;
 use crate::compile_script::{compile_script_setup_inline, TemplateParts};
 use crate::compile_template::{
     compile_template_block, compile_template_block_vapor, extract_template_parts,
+    extract_template_parts_full,
 };
 use crate::rewrite_default::rewrite_default;
 use crate::script::ScriptCompileContext;
@@ -49,11 +50,12 @@ pub fn compile_sfc(
     let has_scoped = descriptor.styles.iter().any(|s| s.scoped);
 
     // Detect vapor mode from script attrs
-    let is_vapor = descriptor
-        .script_setup
-        .as_ref()
-        .map(|s| s.attrs.contains_key("vapor"))
-        .unwrap_or(false)
+    let is_vapor = options.vapor
+        || descriptor
+            .script_setup
+            .as_ref()
+            .map(|s| s.attrs.contains_key("vapor"))
+            .unwrap_or(false)
         || descriptor
             .script
             .as_ref()
@@ -90,29 +92,36 @@ pub fn compile_sfc(
     // Case 1: Template only - just output render function
     if !has_script && !has_script_setup && has_template {
         let template = descriptor.template.as_ref().unwrap();
-        // Enable hoisting for template-only SFCs (hoisted consts go at module level)
-        let mut template_opts = options.template.clone();
-        let mut dom_opts = template_opts.compiler_options.take().unwrap_or_default();
-        dom_opts.hoist_static = true;
-        template_opts.compiler_options = Some(dom_opts);
-        // Don't pass scope IDs to template compiler - scoped CSS is handled by
-        // runtime __scopeId and CSS transformation, not by adding attributes
-        // to template elements during compilation.
-        let template_result = compile_template_block(
-            template,
-            &template_opts,
-            &scope_id,
-            false,
-            is_ts,
-            None,
-            None,
-        );
+        let template_result = if is_vapor {
+            compile_template_block_vapor(template, &scope_id, has_scoped, None)
+        } else {
+            // Enable hoisting for template-only SFCs (hoisted consts go at module level)
+            let mut template_opts = options.template.clone();
+            let mut dom_opts = template_opts.compiler_options.take().unwrap_or_default();
+            dom_opts.hoist_static = true;
+            template_opts.compiler_options = Some(dom_opts);
+            // Don't pass scope IDs to template compiler - scoped CSS is handled by
+            // runtime __scopeId and CSS transformation, not by adding attributes
+            // to template elements during compilation.
+            compile_template_block(
+                template,
+                &template_opts,
+                &scope_id,
+                false,
+                is_ts,
+                None,
+                None,
+            )
+        };
 
         match template_result {
             Ok(template_code) => {
-                // Template-only SFC: output just the render function with export.
-                // The template compiler already generates `export function render(...)`.
                 code = template_code;
+                if is_vapor {
+                    code.push_str("const _sfc_main = { __vapor: true }\n");
+                    code.push_str("_sfc_main.render = render\n");
+                    code.push_str("export default _sfc_main\n");
+                }
             }
             Err(e) => errors.push(e),
         }
@@ -158,22 +167,26 @@ pub fn compile_sfc(
         // Compile template if present
         if has_template {
             let template = descriptor.template.as_ref().unwrap();
-            let mut template_opts = options.template.clone();
-            let mut dom_opts = template_opts.compiler_options.take().unwrap_or_default();
-            dom_opts.hoist_static = true;
-            template_opts.compiler_options = Some(dom_opts);
-
-            // Don't pass scope IDs to template compiler - scoped CSS is handled by
-            // runtime __scopeId and CSS transformation.
-            let template_result = compile_template_block(
-                template,
-                &template_opts,
-                &scope_id,
-                false,
-                is_ts,
-                None, // No bindings for normal scripts
-                None, // No Croquis for normal scripts
-            );
+            let template_result = if is_vapor {
+                compile_template_block_vapor(template, &scope_id, has_scoped, None)
+            } else {
+                let mut template_opts = options.template.clone();
+                let mut dom_opts = template_opts.compiler_options.take().unwrap_or_default();
+                dom_opts.hoist_static = true;
+                template_opts.compiler_options = Some(dom_opts);
+
+                // Don't pass scope IDs to template compiler - scoped CSS is handled by
+                // runtime __scopeId and CSS transformation.
+                compile_template_block(
+                    template,
+                    &template_opts,
+                    &scope_id,
+                    false,
+                    is_ts,
+                    None, // No bindings for normal scripts
+                    None, // No Croquis for normal scripts
+                )
+            };
 
             match template_result {
                 Ok(template_code) => {
@@ -187,6 +200,9 @@ pub fn compile_sfc(
                     code.push('\n');
 
                     // Export the component with render attached
+                    if is_vapor {
+                        code.push_str("_sfc_main.__vapor = true\n");
+                    }
                     code.push_str("_sfc_main.render = render\n");
                     code.push_str("export default _sfc_main\n");
                 }
@@ -200,6 +216,9 @@ pub fn compile_sfc(
         } else {
             // No template - just output rewritten script and export
             code.push_str(&final_script);
+            if is_vapor {
+                code.push_str("\n_sfc_main.__vapor = true");
+            }
             code.push_str("\nexport default _sfc_main\n");
         }
 
@@ -314,7 +333,10 @@ pub fn compile_sfc(
     let template_result = if let Some(template) = &descriptor.template {
         if is_vapor {
             Some(compile_template_block_vapor(
-                template, &scope_id, has_scoped,
+                template,
+                &scope_id,
+                has_scoped,
+                Some(&script_bindings),
             ))
         } else {
             // Don't pass scope IDs to template compiler - scoped CSS is handled by
@@ -334,23 +356,39 @@ pub fn compile_sfc(
     };
 
     // Extract template parts for inline mode (imports, hoisted, preamble, render_body)
-    let (template_imports, template_hoisted, template_preamble, render_body) =
+    let (template_imports, template_hoisted, template_render_fn, template_preamble, render_body) =
         match &template_result {
-            Some(Ok(template_code)) => extract_template_parts(template_code),
+            Some(Ok(template_code)) => {
+                if is_vapor {
+                    let (imports, hoisted, render_fn) = extract_template_parts_full(template_code);
+                    (
+                        imports,
+                        hoisted,
+                        render_fn,
+                        String::default(),
+                        String::default(),
+                    )
+                } else {
+                    let (imports, hoisted, preamble, body) = extract_template_parts(template_code);
+                    (imports, hoisted, String::default(), preamble, body)
+                }
+            }
             Some(Err(e)) => {
                 errors.push(e.clone());
                 (
                     String::default(),
                     String::default(),
                     String::default(),
                     String::default(),
+                    String::default(),
                 )
             }
             None => (
                 String::default(),
                 String::default(),
                 String::default(),
                 String::default(),
+                String::default(),
             ),
         };
 
@@ -370,11 +408,14 @@ pub fn compile_sfc(
         &component_name,
         is_ts,
         source_is_ts,
+        is_vapor,
         TemplateParts {
             imports: &template_imports,
             hoisted: &template_hoisted,
+            render_fn: &template_render_fn,
             preamble: &template_preamble,
             render_body: &render_body,
+            render_is_block: is_vapor,
         },
         normal_script_content.as_deref(),
         &descriptor.css_vars,