feat(playground): dev

package.json

@@ -30,8 +30,7 @@
     "dev-sfc": "run-s dev-prepare-cjs dev-sfc-run",
     "dev-sfc-serve": "vite packages/sfc-playground --host",
     "dev-sfc-run": "run-p \"dev compiler-sfc -f esm-browser\" \"dev vue -if esm-bundler-runtime\" \"dev vue -ipf esm-browser-runtime\" \"dev server-renderer -if esm-bundler\" dev-sfc-serve",
-    "dev-vapor": "run-s dev-prepare-cjs dev-vapor-run",
-    "dev-vapor-run": "run-p \"dev vue-vapor -if esm-bundler-runtime\" \"dev compiler-vapor -ipf esm-bundler\" dev-vapor-serve",
+    "dev-vapor": "run-s dev-prepare-cjs dev-vapor-serve",
     "dev-vapor-serve": "pnpm -C playground run dev",
     "serve": "serve",
     "open": "open http://localhost:3000/packages/template-explorer/local.html",

playground/vite.config.ts

@@ -1,20 +1,72 @@
-import { defineConfig } from 'vite'
+import path from 'node:path'
+import { type Plugin, defineConfig } from 'vite'
 import Vue from '@vitejs/plugin-vue'
 import Inspect from 'vite-plugin-inspect'
-// @ts-ignore
-import * as CompilerVapor from '../packages/compiler-vapor/dist/compiler-vapor.esm-bundler.prod.js'
-
-const vue = Vue({
-  isProduction: true,
-  template: {
-    compiler: CompilerVapor
-  }
-})
+import * as CompilerVapor from '../packages/compiler-vapor/src'
 
 export default defineConfig({
   build: {
     target: 'esnext'
   },
   clearScreen: false,
-  plugins: [vue, Inspect()]
+  plugins: [
+    DevPlugin(),
+    Vue({
+      isProduction: true,
+      template: {
+        compiler: CompilerVapor
+      }
+    }),
+    Inspect()
+  ]
 })
+
+function DevPlugin(): Plugin {
+  const resolve = (p: string) => path.resolve(__dirname, '..', p)
+  return {
+    name: 'dev-plugin',
+    config() {
+      return {
+        resolve: {
+          alias: {
+            'vue/vapor': resolve('packages/vue/vapor/index.mjs'),
+            vue: resolve('packages/vue/src/runtime.ts'),
+            '@vue/vapor': resolve('packages/vue-vapor/src/index.ts'),
+            '@vue/runtime-dom': resolve('packages/runtime-dom/src/index.ts'),
+            '@vue/runtime-core': resolve('packages/runtime-core/src/index.ts'),
+            '@vue/shared': resolve('packages/shared/src/index.ts'),
+            '@vue/reactivity': resolve('packages/reactivity/src/index.ts'),
+            '@vue/compiler-vapor': resolve(
+              'packages/compiler-vapor/src/index.ts'
+            ),
+            '@vue/runtime-vapor': resolve('packages/runtime-vapor/src/index.ts')
+          }
+        },
+        define: {
+          __COMMIT__: `"__COMMIT__"`,
+          __VERSION__: `"0.0.0"`,
+          __DEV__: `true`,
+          // this is only used during Vue's internal tests
+          __TEST__: `false`,
+          // If the build is expected to run directly in the browser (global / esm builds)
+          __BROWSER__: String(true),
+          __GLOBAL__: String(false),
+          __ESM_BUNDLER__: String(true),
+          __ESM_BROWSER__: String(false),
+          // is targeting Node (SSR)?
+          __NODE_JS__: String(false),
+          // need SSR-specific branches?
+          __SSR__: String(false),
+
+          // 2.x compat build
+          __COMPAT__: String(false),
+
+          // feature flags
+          __FEATURE_SUSPENSE__: `true`,
+          __FEATURE_OPTIONS_API__: `true`,
+          __FEATURE_PROD_DEVTOOLS__: `false`
+        }
+      }
+    }
+  }
+}