@vylos/cli 0.1.0

package/bin/vylos.mjs

@@ -0,0 +1,16 @@
+#!/usr/bin/env node
+import { spawn } from 'node:child_process';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath, pathToFileURL } from 'node:url';
+import { createRequire } from 'node:module';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const require = createRequire(import.meta.url);
+const tsxLoader = pathToFileURL(require.resolve('tsx')).href;
+const cli = resolve(__dirname, '..', 'src', 'index.ts');
+
+const child = spawn(process.execPath, ['--import', tsxLoader, cli, ...process.argv.slice(2)], {
+  stdio: 'inherit',
+  cwd: process.cwd(),
+});
+child.on('exit', (code) => process.exit(code ?? 0));

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@vylos/cli",
+  "version": "0.1.0",
+  "type": "module",
+  "bin": {
+    "vylos": "./bin/vylos.mjs"
+  },
+  "dependencies": {
+    "@vitejs/plugin-vue": "^5.2.1",
+    "vue": "^3.5.13",
+    "vite": "^6.0.7",
+    "vite-plugin-singlefile": "^2.0.3",
+    "tailwindcss": "^4.0.0",
+    "@tailwindcss/vite": "^4.0.0",
+    "tsx": "^4.19.2",
+    "@vylos/core": "0.1.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.7.2"
+  },
+  "scripts": {
+    "dev": "tsx src/index.ts dev",
+    "build": "tsx src/index.ts build"
+  }
+}

package/src/commands/build.ts

@@ -0,0 +1,38 @@
+import { build as viteBuild } from 'vite';
+import vue from '@vitejs/plugin-vue';
+import tailwindcss from '@tailwindcss/vite';
+import { viteSingleFile } from 'vite-plugin-singlefile';
+import { resolve } from 'path';
+import { vylosProjectPlugin } from '../vite/projectPlugin';
+import { vylosI18nPlugin } from '../vite/i18nPlugin';
+
+export async function build(projectRoot: string) {
+  console.log(`\n  Vylos building...\n  Project: ${projectRoot}\n`);
+
+  const outDir = resolve(projectRoot, 'dist');
+
+  await viteBuild({
+    root: projectRoot,
+    plugins: [
+      vue(),
+      tailwindcss(),
+      vylosProjectPlugin(projectRoot),
+      vylosI18nPlugin(projectRoot),
+      viteSingleFile(),
+    ],
+    resolve: {
+      alias: {
+        '@project': projectRoot,
+      },
+    },
+    build: {
+      outDir,
+      emptyOutDir: true,
+      rollupOptions: {
+        input: resolve(projectRoot, 'index.html'),
+      },
+    },
+  });
+
+  console.log(`\n  Build complete: ${outDir}\n`);
+}

package/src/commands/create.ts

@@ -0,0 +1,32 @@
+import { resolve, dirname } from 'path';
+import { existsSync, mkdirSync, cpSync } from 'fs';
+import { fileURLToPath } from 'url';
+
+export async function create(name: string, targetDir?: string) {
+  const dest = resolve(targetDir ?? process.cwd(), name);
+
+  if (existsSync(dest)) {
+    console.error(`  Directory already exists: ${dest}`);
+    process.exit(1);
+  }
+
+  // Templates are shipped with @vylos/cli
+  const cliRoot = resolve(dirname(fileURLToPath(import.meta.url)), '..', '..');
+  const templateDir = resolve(cliRoot, 'templates');
+
+  if (!existsSync(templateDir)) {
+    console.error(`  Template directory not found: ${templateDir}`);
+    process.exit(1);
+  }
+
+  console.log(`\n  Creating Vylos project: ${name}\n`);
+
+  mkdirSync(dest, { recursive: true });
+  cpSync(templateDir, dest, { recursive: true });
+
+  console.log(`  Project created at: ${dest}`);
+  console.log(`\n  Next steps:`);
+  console.log(`    cd ${name}`);
+  console.log(`    pnpm install`);
+  console.log(`    pnpm dev\n`);
+}

package/src/commands/dev.ts

@@ -0,0 +1,38 @@
+import { createServer } from 'vite';
+import vue from '@vitejs/plugin-vue';
+import tailwindcss from '@tailwindcss/vite';
+import { resolve } from 'path';
+import { vylosProjectPlugin } from '../vite/projectPlugin';
+import { vylosI18nPlugin } from '../vite/i18nPlugin';
+import { vylosEditorApiPlugin } from '../vite/editorApiPlugin';
+
+export async function dev(projectRoot: string) {
+  console.log(`\n  Vylos dev server starting...\n  Project: ${projectRoot}\n`);
+
+  const server = await createServer({
+    root: projectRoot,
+    plugins: [
+      vue(),
+      tailwindcss(),
+      vylosProjectPlugin(projectRoot),
+      vylosI18nPlugin(projectRoot),
+      vylosEditorApiPlugin(),
+    ],
+    resolve: {
+      alias: {
+        '@project': projectRoot,
+      },
+      dedupe: ['vue', 'pinia'],
+    },
+    optimizeDeps: {
+      include: ['vue', 'pinia', 'reflect-metadata'],
+    },
+    server: {
+      port: 5173,
+      open: true,
+    },
+  });
+
+  await server.listen();
+  server.printUrls();
+}

package/src/commands/editor.ts

@@ -0,0 +1,28 @@
+import { createServer } from 'vite';
+import vue from '@vitejs/plugin-vue';
+import { dirname, resolve } from 'path';
+import { fileURLToPath } from 'url';
+import { vylosEditorApiPlugin } from '../vite/editorApiPlugin';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+export async function editor(projectRoot: string) {
+  console.log(`\n  Vylos editor starting...\n  Project: ${projectRoot}\n`);
+
+  const editorRoot = resolve(__dirname, '..', 'editor');
+
+  const server = await createServer({
+    root: editorRoot,
+    plugins: [
+      vue(),
+      vylosEditorApiPlugin(),
+    ],
+    server: {
+      port: 5174,
+      open: true,
+    },
+  });
+
+  await server.listen();
+  server.printUrls();
+}

package/src/commands/verify.ts

@@ -0,0 +1,24 @@
+import { execSync } from 'child_process';
+import { resolve } from 'path';
+import { existsSync } from 'fs';
+
+export async function verify(projectRoot: string) {
+  console.log(`\n  Vylos verify\n  Project: ${projectRoot}\n`);
+
+  const tsconfig = resolve(projectRoot, 'tsconfig.json');
+  if (!existsSync(tsconfig)) {
+    console.error(`  Error: No tsconfig.json found at ${projectRoot}`);
+    process.exit(1);
+  }
+
+  try {
+    execSync('vue-tsc --noEmit', {
+      cwd: projectRoot,
+      stdio: 'inherit',
+    });
+    console.log('\n  Verification passed — no type errors found.\n');
+  } catch {
+    console.error('\n  Verification failed — type errors found above.\n');
+    process.exit(1);
+  }
+}

package/src/editor/App.vue

@@ -0,0 +1,8 @@
+<template>
+  <div style="display:flex;align-items:center;justify-content:center;height:100vh;font-family:system-ui,sans-serif;background:#1a1a2e;color:#e0e0e0;">
+    <div style="text-align:center;">
+      <h1 style="font-size:2rem;margin-bottom:0.5rem;">Vylos Editor</h1>
+      <p style="opacity:0.6;">Coming Soon</p>
+    </div>
+  </div>
+</template>

package/src/editor/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vylos Editor</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="./main.ts"></script>
+  </body>
+</html>

package/src/editor/main.ts

@@ -0,0 +1,4 @@
+import { createApp } from 'vue';
+import App from './App.vue';
+
+createApp(App).mount('#app');

package/src/index.ts

@@ -0,0 +1,65 @@
+#!/usr/bin/env node
+import { resolve } from 'path';
+
+const args = process.argv.slice(2);
+const command = args[0];
+
+async function main() {
+  switch (command) {
+    case 'dev': {
+      const projectRoot = resolve(args[1] ?? process.cwd());
+      const { dev } = await import('./commands/dev');
+      await dev(projectRoot);
+      break;
+    }
+
+    case 'build': {
+      const projectRoot = resolve(args[1] ?? process.cwd());
+      const { build } = await import('./commands/build');
+      await build(projectRoot);
+      break;
+    }
+
+    case 'editor': {
+      const projectRoot = resolve(args[1] ?? process.cwd());
+      const { editor } = await import('./commands/editor');
+      await editor(projectRoot);
+      break;
+    }
+
+    case 'verify': {
+      const projectRoot = resolve(args[1] ?? process.cwd());
+      const { verify } = await import('./commands/verify');
+      await verify(projectRoot);
+      break;
+    }
+
+    case 'create': {
+      const name = args[1];
+      if (!name) {
+        console.error('  Usage: vylos create <project-name>');
+        process.exit(1);
+      }
+      const { create } = await import('./commands/create');
+      await create(name, args[2]);
+      break;
+    }
+
+    default:
+      console.log(`
+  Vylos — Visual Novel Engine
+
+  Usage:
+    vylos dev [project-dir]     Start dev server
+    vylos build [project-dir]   Build for production
+    vylos editor [project-dir]  Open visual editor
+    vylos verify [project-dir]  Type-check project
+    vylos create <name>         Create new project
+`);
+  }
+}
+
+main().catch((error) => {
+  console.error(error);
+  process.exit(1);
+});

package/src/vite/config.ts

@@ -0,0 +1,37 @@
+import { defineConfig, type UserConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
+import tailwindcss from '@tailwindcss/vite';
+import { resolve } from 'path';
+
+export interface VylosViteOptions {
+  projectRoot: string;
+  mode: 'development' | 'production';
+}
+
+/** Create shared Vite config for Vylos projects */
+export function createViteConfig(options: VylosViteOptions): UserConfig {
+  const { projectRoot, mode } = options;
+
+  return defineConfig({
+    root: projectRoot,
+    mode,
+    plugins: [
+      vue(),
+      tailwindcss(),
+    ],
+    resolve: {
+      alias: {
+        '@project': projectRoot,
+        '@vylos': resolve(projectRoot, 'node_modules/@vylos/core/src'),
+      },
+    },
+    server: {
+      port: 5173,
+      open: true,
+    },
+    build: {
+      outDir: resolve(projectRoot, 'dist'),
+      emptyOutDir: true,
+    },
+  });
+}

package/src/vite/editorApiPlugin.ts

@@ -0,0 +1,32 @@
+import type { Plugin } from 'vite';
+
+/**
+ * REST API stubs for a future visual editor.
+ * Currently only sets up the middleware — no UI.
+ */
+export function vylosEditorApiPlugin(): Plugin {
+  return {
+    name: 'vylos-editor-api',
+    apply: 'serve', // dev only
+
+    configureServer(server) {
+      // GET /api/state — current engine state (placeholder)
+      server.middlewares.use('/api/state', (_req, res) => {
+        res.setHeader('Content-Type', 'application/json');
+        res.end(JSON.stringify({ status: 'editor-api-stub', message: 'Not implemented yet' }));
+      });
+
+      // GET /api/files — list project files (placeholder)
+      server.middlewares.use('/api/files', (_req, res) => {
+        res.setHeader('Content-Type', 'application/json');
+        res.end(JSON.stringify({ status: 'editor-api-stub', files: [] }));
+      });
+
+      // GET /api/assets — list project assets (placeholder)
+      server.middlewares.use('/api/assets', (_req, res) => {
+        res.setHeader('Content-Type', 'application/json');
+        res.end(JSON.stringify({ status: 'editor-api-stub', assets: [] }));
+      });
+    },
+  };
+}

package/src/vite/i18nPlugin.ts

@@ -0,0 +1,126 @@
+import type { Plugin } from 'vite';
+import { resolve, relative, dirname, basename } from 'path';
+import { existsSync, readdirSync, writeFileSync, mkdirSync } from 'fs';
+
+const VIRTUAL_PREFIX = 'vylos:texts/';
+const RESOLVED_PREFIX = '\0vylos:texts/';
+
+/**
+ * Vite plugin that merges per-language text files into virtual modules.
+ *
+ * Given: locations/cafe/texts/talk_barista/en.ts + fr.ts
+ * Produces virtual module: vylos:texts/cafe/talk_barista
+ * Which exports: { greeting: { en: "Hello!", fr: "Salut!" }, ... }
+ *
+ * Also generates .d.ts files for IntelliSense.
+ */
+export function vylosI18nPlugin(projectRoot: string): Plugin {
+  const textModules = new Map<string, string[]>(); // moduleId → list of lang file paths
+
+  function scanTextDirs() {
+    textModules.clear();
+    const dirs = [
+      { base: resolve(projectRoot, 'locations'), prefix: '' },
+      { base: resolve(projectRoot, 'global', 'texts'), prefix: 'global/' },
+    ];
+
+    for (const { base, prefix } of dirs) {
+      if (!existsSync(base)) continue;
+
+      if (prefix === 'global/') {
+        // global/texts/<scope>/<lang>.ts
+        for (const scope of safeDirRead(base)) {
+          const scopeDir = resolve(base, scope);
+          const langs = safeDirRead(scopeDir).filter(f => f.endsWith('.ts'));
+          if (langs.length > 0) {
+            textModules.set(`global/${scope}`, langs.map(l => resolve(scopeDir, l)));
+          }
+        }
+      } else {
+        // locations/<loc>/texts/<scope>/<lang>.ts
+        for (const loc of safeDirRead(base)) {
+          const textsDir = resolve(base, loc, 'texts');
+          if (!existsSync(textsDir)) continue;
+          for (const scope of safeDirRead(textsDir)) {
+            const scopeDir = resolve(textsDir, scope);
+            const langs = safeDirRead(scopeDir).filter(f => f.endsWith('.ts'));
+            if (langs.length > 0) {
+              textModules.set(`${loc}/${scope}`, langs.map(l => resolve(scopeDir, l)));
+            }
+          }
+        }
+      }
+    }
+  }
+
+  return {
+    name: 'vylos-i18n',
+
+    buildStart() {
+      scanTextDirs();
+    },
+
+    resolveId(id) {
+      if (id.startsWith(VIRTUAL_PREFIX)) {
+        return RESOLVED_PREFIX + id.slice(VIRTUAL_PREFIX.length);
+      }
+    },
+
+    load(id) {
+      if (!id.startsWith(RESOLVED_PREFIX)) return;
+
+      const moduleId = id.slice(RESOLVED_PREFIX.length);
+      const langFiles = textModules.get(moduleId);
+
+      if (!langFiles) {
+        return `export default {};`;
+      }
+
+      // Generate code that imports all lang files and merges them
+      const imports: string[] = [];
+      const langs: string[] = [];
+
+      for (const filePath of langFiles) {
+        const lang = basename(filePath, '.ts');
+        const varName = `_${lang}`;
+        imports.push(`import ${varName} from '${filePath.replace(/\\/g, '/')}';`);
+        langs.push(lang);
+      }
+
+      const mergeCode = `
+${imports.join('\n')}
+
+const _texts = {};
+const _langs = { ${langs.map(l => `${l}: _${l}`).join(', ')} };
+
+for (const [lang, entries] of Object.entries(_langs)) {
+  for (const [key, value] of Object.entries(entries)) {
+    if (!_texts[key]) _texts[key] = {};
+    _texts[key][lang] = value;
+  }
+}
+
+export default _texts;
+`;
+      return mergeCode;
+    },
+
+    handleHotUpdate({ file }) {
+      // If a text file changed, trigger rescan
+      const rel = relative(projectRoot, file).replace(/\\/g, '/');
+      if (rel.includes('/texts/') && file.endsWith('.ts')) {
+        scanTextDirs();
+      }
+    },
+  };
+}
+
+function safeDirRead(dir: string): string[] {
+  try {
+    return readdirSync(dir, { withFileTypes: true })
+      .filter(d => d.isDirectory() || d.isFile())
+      .map(d => d.name);
+  } catch {
+    return [];
+  }
+}

package/src/vite/projectPlugin.ts

@@ -0,0 +1,67 @@
+import type { Plugin } from 'vite';
+import { resolve } from 'path';
+import { existsSync } from 'fs';
+
+/**
+ * Vite plugin that resolves virtual module `vylos:project` to the project's config.
+ * Also serves project assets.
+ */
+export function vylosProjectPlugin(projectRoot: string): Plugin {
+  const virtualModuleId = 'vylos:project';
+  const resolvedVirtualModuleId = '\0' + virtualModuleId;
+
+  return {
+    name: 'vylos-project',
+
+    resolveId(id) {
+      if (id === virtualModuleId) {
+        return resolvedVirtualModuleId;
+      }
+    },
+
+    load(id) {
+      if (id === resolvedVirtualModuleId) {
+        const configPath = resolve(projectRoot, 'vylos.config.ts');
+        const setupPath = resolve(projectRoot, 'setup.ts');
+
+        let code = `export { default as config } from '${configPath.replace(/\\/g, '/')}';\n`;
+
+        if (existsSync(setupPath)) {
+          code += `export { default as plugin } from '${setupPath.replace(/\\/g, '/')}';\n`;
+        } else {
+          code += `export const plugin = undefined;\n`;
+        }
+
+        return code;
+      }
+    },
+
+    configureServer(server) {
+      // Serve location assets
+      const locationsDir = resolve(projectRoot, 'locations');
+      const globalDir = resolve(projectRoot, 'global');
+
+      server.middlewares.use((req, _res, next) => {
+        if (!req.url) return next();
+
+        // Rewrite /locations/... to project locations dir
+        if (req.url.startsWith('/locations/')) {
+          const assetPath = resolve(locationsDir, req.url.slice('/locations/'.length));
+          if (existsSync(assetPath)) {
+            req.url = '/@fs/' + assetPath.replace(/\\/g, '/');
+          }
+        }
+
+        // Rewrite /global/... to project global dir
+        if (req.url.startsWith('/global/')) {
+          const assetPath = resolve(globalDir, req.url.slice('/global/'.length));
+          if (existsSync(assetPath)) {
+            req.url = '/@fs/' + assetPath.replace(/\\/g, '/');
+          }
+        }
+
+        next();
+      });
+    },
+  };
+}

package/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "./dist",
+    "rootDir": "./src",
+    "types": ["node"]
+  },
+  "include": ["src/**/*.ts"],
+  "exclude": ["node_modules", "dist"]
+}