feat: add feature plugin tests and validation for feature flags

vite-layers/example/apps/main/app.config.ts

@@ -1,18 +1,29 @@
 import vue from '@vitejs/plugin-vue'
+import tailwind from '@tailwindcss/vite'
+import { DevTools } from '@vitejs/devtools'
 import { defineLayerConfig } from '../../../src/index.ts'
 
 export default defineLayerConfig({
   name: 'main',
-  features: { billing: true, p2p: true },
-  // The framework plugin lives in the layer config, not in vite-layers' core.
-  vite: {
-    plugins: [vue()],
+  // `billing` gates a whole page (build-time DCE); `betaBanner` toggles a UI accent and is
+  // turned off in production via the `$production` env override below.
+  features: { billing: true, betaBanner: true },
+
+  // Framework + CSS plugins live in the layer config, not in vite-layers' core. Brands inherit them.
+  // The Vite DevTools hub is added in dev only (`DevTools()` is async → a Promise<Plugin[]>, a valid
+  // plugin entry); vite-layers auto-mounts its Layers / Features / Resolver / Public & TS panels into
+  // it via `buildViteConfig`. Build output is untouched (the hub is excluded when command is 'build').
+  vite: ({ command }) => ({
+    plugins: [vue(), tailwind(), command === 'serve' && DevTools()],
     build: { rolldownOptions: { input: { main: '@/main.ts' } } },
-  },
+  }),
+
   // Per-layer tsconfig tweaks (merged across the stack, like Nuxt's typescript.tsConfig).
-  tsConfig: { compilerOptions: { jsx: 'preserve', jsxImportSource: 'vue' } },
+  // `vite/client` supplies ambient module decls for the CSS side-effect imports (`*.css`) and
+  // `import.meta.env`. It flows into every brand's generated app tsconfig too.
+  tsConfig: { compilerOptions: { jsx: 'preserve', jsxImportSource: 'vue', types: ['vite/client'] } },
 
   $production: {
-    features: { p2p: false },
-  }
+    features: { betaBanner: false }, // the beta accent never ships to prod
+  },
 })