From aa5fe96d17407abb620af9a5264b04521a6ddc6c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?=
 <sxzz@sxzz.moe>
Date: Thu, 20 Jun 2024 19:11:01 +0800
Subject: [PATCH] feat(template-explorer): add vapor option

---
 packages/template-explorer/src/index.ts   | 11 +++++++++--
 packages/template-explorer/src/options.ts | 13 +++++++++++++
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/packages/template-explorer/src/index.ts b/packages/template-explorer/src/index.ts
index fb16a9bf4..96619b5a3 100644
--- a/packages/template-explorer/src/index.ts
+++ b/packages/template-explorer/src/index.ts
@@ -1,6 +1,10 @@
 import type * as m from 'monaco-editor'
 import type { CompilerError } from '@vue/compiler-dom'
-import { type CompilerOptions, compile } from '@vue/compiler-vapor'
+import { compile } from '@vue/compiler-dom'
+import {
+  type CompilerOptions,
+  compile as vaporCompile,
+} from '@vue/compiler-vapor'
 // import { compile as ssrCompile } from '@vue/compiler-ssr'
 
 import {
@@ -8,6 +12,7 @@ import {
   defaultOptions,
   initOptions,
   ssrMode,
+  vaporMode,
 } from './options'
 import { toRaw, watchEffect } from '@vue/runtime-dom'
 import { SourceMapConsumer } from 'source-map-js'
@@ -75,7 +80,9 @@ window.init = () => {
     console.clear()
     try {
       const errors: CompilerError[] = []
-      const compileFn = /* ssrMode.value ? ssrCompile : */ compile
+      const compileFn = /* ssrMode.value ? ssrCompile : */ (
+        vaporMode.value ? vaporCompile : compile
+      ) as typeof vaporCompile
       const start = performance.now()
       const { code, ast, map } = compileFn(source, {
         ...compilerOptions,
diff --git a/packages/template-explorer/src/options.ts b/packages/template-explorer/src/options.ts
index 581bffc43..6cf682adf 100644
--- a/packages/template-explorer/src/options.ts
+++ b/packages/template-explorer/src/options.ts
@@ -3,6 +3,7 @@ import type { CompilerOptions } from '@vue/compiler-vapor'
 import { BindingTypes } from '@vue/compiler-core'
 
 export const ssrMode = ref(false)
+export const vaporMode = ref(true)
 
 export const defaultOptions: CompilerOptions = {
   mode: 'module',
@@ -222,6 +223,18 @@ const App = {
               }),
               h('label', { for: 'compat' }, 'v2 compat mode'),
             ]),
+
+            h('li', [
+              h('input', {
+                type: 'checkbox',
+                id: 'vapor',
+                checked: vaporMode.value,
+                onChange(e: Event) {
+                  vaporMode.value = (e.target as HTMLInputElement).checked
+                },
+              }),
+              h('label', { for: 'vapor' }, 'vapor'),
+            ]),
           ]),
         ]),
       ]