@jasonshimmy/vite-plugin-cer-app 0.23.2 → 0.24.0

package/src/cli/create/index.ts

@@ -1,275 +0,0 @@
-#!/usr/bin/env node
-/**
- * create-cer-app scaffold CLI.
- * Usage: create-cer-app [project-name] [--mode spa|ssr|ssg]
- */
-import { Command } from 'commander'
-import { resolve, join, dirname, basename } from 'pathe'
-import { existsSync } from 'node:fs'
-import { mkdir, readFile, writeFile, readdir, stat } from 'node:fs/promises'
-import { createInterface } from 'node:readline'
-import { fileURLToPath } from 'node:url'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
-
-type AppMode = 'spa' | 'ssr' | 'ssg'
-
-/**
- * Prompts the user for input on stdin.
- */
-function prompt(question: string, defaultValue?: string): Promise<string> {
-  return new Promise((resolve) => {
-    const rl = createInterface({ input: process.stdin, output: process.stdout })
-    const displayQuestion = defaultValue
-      ? `${question} (${defaultValue}): `
-      : `${question}: `
-
-    rl.question(displayQuestion, (answer) => {
-      rl.close()
-      resolve(answer.trim() || defaultValue || '')
-    })
-  })
-}
-
-/**
- * Prompts the user to choose a mode from a list.
- */
-async function promptMode(): Promise<AppMode> {
-  console.log('Select app mode:')
-  console.log('  1. spa  — Single-Page App (client-side rendering)')
-  console.log('  2. ssr  — Server-Side Rendering')
-  console.log('  3. ssg  — Static Site Generation')
-
-  const answer = await prompt('Mode [1/2/3]', '1')
-
-  const modeMap: Record<string, AppMode> = {
-    '1': 'spa',
-    '2': 'ssr',
-    '3': 'ssg',
-    spa: 'spa',
-    ssr: 'ssr',
-    ssg: 'ssg',
-  }
-
-  return modeMap[answer] ?? 'spa'
-}
-
-/**
- * Recursively reads all files from the template directory.
- */
-async function readTemplateFiles(dir: string): Promise<Map<string, string>> {
-  const files = new Map<string, string>()
-
-  async function walk(currentDir: string, prefix: string): Promise<void> {
-    const entries = await readdir(currentDir)
-    for (const entry of entries) {
-      const fullPath = join(currentDir, entry)
-      const relativePath = prefix ? `${prefix}/${entry}` : entry
-      const info = await stat(fullPath)
-
-      if (info.isDirectory()) {
-        await walk(fullPath, relativePath)
-      } else {
-        const content = await readFile(fullPath, 'utf-8')
-        // Strip .tpl extension from key
-        const key = relativePath.endsWith('.tpl') ? relativePath.slice(0, -4) : relativePath
-        files.set(key, content)
-      }
-    }
-  }
-
-  await walk(dir, '')
-  return files
-}
-
-/**
- * Replaces template tokens in a content string.
- */
-function applyTokens(content: string, tokens: Record<string, string>): string {
-  let result = content
-  for (const [key, value] of Object.entries(tokens)) {
-    result = result.replaceAll(`{{${key}}}`, value)
-  }
-  return result
-}
-
-/**
- * Writes template files to the target directory.
- */
-async function writeTemplateFiles(
-  files: Map<string, string>,
-  targetDir: string,
-  tokens: Record<string, string>,
-): Promise<void> {
-  for (const [relativePath, rawContent] of files) {
-    const content = applyTokens(rawContent, tokens)
-    const outputPath = join(targetDir, relativePath)
-    await mkdir(dirname(outputPath), { recursive: true })
-    await writeFile(outputPath, content, 'utf-8')
-  }
-}
-
-/**
- * Returns the path to the shared template directory (files common to all modes).
- */
-function getSharedTemplateDir(): string {
-  return join(__dirname, 'templates', 'shared')
-}
-
-/**
- * Returns the path to the mode-specific template directory.
- * Resolves relative to the compiled dist output.
- */
-function getModeTemplateDir(mode: AppMode): string {
-  // When running from compiled dist/, templates are in create/templates/
-  // This file is at dist/cli/create/index.js, so templates are at dist/cli/create/templates/
-  return join(__dirname, 'templates', mode)
-}
-
-async function main(): Promise<void> {
-  const program = new Command()
-
-  program
-    .name('create-cer-app')
-    .description('Scaffold a new CER App project')
-    .argument('[project-name]', 'Name of the project to create')
-    .option('--mode <mode>', 'App mode: spa, ssr, or ssg')
-    .option('--dir <dir>', 'Directory to create the project in (defaults to project name)')
-    .action(async (projectNameArg?: string, options?: { mode?: string; dir?: string }) => {
-      console.log('\nWelcome to create-cer-app!\n')
-
-      // Gather inputs
-      const projectName = projectNameArg ?? (await prompt('Project name', 'my-cer-app'))
-      const mode: AppMode = (options?.mode as AppMode | undefined) ?? (await promptMode())
-      const targetDir = resolve(options?.dir ?? projectName)
-
-      console.log(`\nCreating ${mode.toUpperCase()} project: ${projectName}`)
-      console.log(`  Directory: ${targetDir}\n`)
-
-      if (existsSync(targetDir)) {
-        const overwrite = await prompt(`Directory "${targetDir}" already exists. Overwrite? [y/N]`, 'N')
-        if (!overwrite.toLowerCase().startsWith('y')) {
-          console.log('Aborted.')
-          process.exit(0)
-        }
-      }
-
-      // Load template files: shared first, then mode-specific (mode overrides shared)
-      const sharedDir = getSharedTemplateDir()
-      const modeDir = getModeTemplateDir(mode)
-
-      if (!existsSync(sharedDir) && !existsSync(modeDir)) {
-        // Fallback: generate minimal template inline
-        console.warn(`[create-cer-app] Template directory not found at ${modeDir}, using inline template.`)
-        await generateInlineTemplate(targetDir, projectName, mode)
-      } else {
-        const files = new Map<string, string>()
-        if (existsSync(sharedDir)) {
-          for (const [k, v] of await readTemplateFiles(sharedDir)) files.set(k, v)
-        }
-        if (existsSync(modeDir)) {
-          for (const [k, v] of await readTemplateFiles(modeDir)) files.set(k, v)
-        }
-        await writeTemplateFiles(files, targetDir, { projectName })
-      }
-
-      console.log(`\nProject created! To get started:\n`)
-      console.log(`  cd ${basename(targetDir)}`)
-      console.log(`  npm install`)
-      console.log(`  npm run dev\n`)
-    })
-
-  await program.parseAsync(process.argv)
-}
-
-/**
- * Generates a minimal project structure inline when templates aren't available.
- */
-async function generateInlineTemplate(
-  targetDir: string,
-  projectName: string,
-  mode: AppMode,
-): Promise<void> {
-  await mkdir(join(targetDir, 'app/pages'), { recursive: true })
-  await mkdir(join(targetDir, 'app/layouts'), { recursive: true })
-  await mkdir(join(targetDir, 'app/components'), { recursive: true })
-  await mkdir(join(targetDir, 'app/composables'), { recursive: true })
-  await mkdir(join(targetDir, 'app/plugins'), { recursive: true })
-  await mkdir(join(targetDir, 'app/middleware'), { recursive: true })
-
-  // package.json
-  await writeFile(
-    join(targetDir, 'package.json'),
-    JSON.stringify(
-      {
-        name: projectName,
-        version: '0.1.0',
-        type: 'module',
-        scripts: {
-          dev: 'cer-app dev',
-          build: 'cer-app build',
-          preview: 'cer-app preview',
-        },
-        dependencies: {
-          '@jasonshimmy/custom-elements-runtime': '^3.2.1',
-        },
-        devDependencies: {
-          vite: '^8.0.1',
-          '@jasonshimmy/vite-plugin-cer-app': '^0.4.2',
-          typescript: '^5.9.3',
-        },
-      },
-      null,
-      2,
-    ),
-    'utf-8',
-  )
-
-  // cer.config.ts
-  await writeFile(
-    join(targetDir, 'cer.config.ts'),
-    `import { defineConfig } from '@jasonshimmy/vite-plugin-cer-app'\n\nexport default defineConfig({\n  mode: '${mode}',\n  autoImports: { components: true, composables: true, directives: true, runtime: true },\n})\n`,
-    'utf-8',
-  )
-
-  // app/pages/index.ts
-  await writeFile(
-    join(targetDir, 'app/pages/index.ts'),
-    `component('page-index', () => {\n  return html\`\n    <div>\n      <h1>Welcome to ${projectName}</h1>\n      <p>Edit <code>app/pages/index.ts</code> to get started.</p>\n    </div>\n  \`\n})\n`,
-    'utf-8',
-  )
-
-  // app/layouts/default.ts
-  await writeFile(
-    join(targetDir, 'app/layouts/default.ts'),
-    `component('layout-default', () => {\n  return html\`\n    <header><nav><router-link to="/">Home</router-link></nav></header>\n    <main><slot></slot></main>\n    <footer><p>Built with CER App</p></footer>\n  \`\n})\n`,
-    'utf-8',
-  )
-
-  // .gitignore
-  await writeFile(
-    join(targetDir, '.gitignore'),
-    `# Dependencies\nnode_modules/\n\n# Build output\ndist/\n\n# CER App generated directory\n.cer/\n\n# Environment variables\n.env.local\n.env.*.local\n\n# Editor\n.vscode/\n.idea/\n*.suo\n*.sw?\n\n# OS\n.DS_Store\nThumbs.db\n\n# Logs\n*.log\n`,
-    'utf-8',
-  )
-
-  // tsconfig.json
-  await writeFile(
-    join(targetDir, 'tsconfig.json'),
-    `{\n  "extends": "./.cer/tsconfig.json"\n}\n`,
-    'utf-8',
-  )
-
-  // index.html
-  await writeFile(
-    join(targetDir, 'index.html'),
-    `<!DOCTYPE html>\n<html lang="en">\n  <head>\n    <meta charset="UTF-8">\n    <meta name="viewport" content="width=device-width, initial-scale=1.0">\n    <title>${projectName}</title>\n  </head>\n  <body>\n    <cer-layout-view></cer-layout-view>\n    <script type="module" src="/@cer/app.ts"></script>\n  </body>\n</html>\n`,
-    'utf-8',
-  )
-}
-
-main().catch((err) => {
-  console.error('[create-cer-app] Fatal error:', err)
-  process.exit(1)
-})

package/src/cli/create/templates/shared/.gitignore.tpl

@@ -1,25 +0,0 @@
-# Dependencies
-node_modules/
-
-# Build output
-dist/
-
-# CER App generated directory
-.cer/
-
-# Environment variables
-.env.local
-.env.*.local
-
-# Editor
-.vscode/
-.idea/
-*.suo
-*.sw?
-
-# OS
-.DS_Store
-Thumbs.db
-
-# Logs
-*.log

package/src/cli/create/templates/shared/app/layouts/default.ts.tpl

@@ -1,15 +0,0 @@
-component('layout-default', () => {
-  return html`
-    <header>
-      <nav>
-        <router-link to="/">Home</router-link>
-      </nav>
-    </header>
-    <main>
-      <slot></slot>
-    </main>
-    <footer>
-      <p>Built with CER App</p>
-    </footer>
-  `
-})

package/src/cli/create/templates/shared/app/pages/index.ts.tpl

@@ -1,8 +0,0 @@
-component('page-index', () => {
-  return html`
-    <div>
-      <h1 class="text-2xl">Welcome to {{projectName}}</h1>
-      <p>Edit <code>app/pages/index.ts</code> to get started.</p>
-    </div>
-  `
-})

package/src/cli/create/templates/shared/index.html.tpl

@@ -1,12 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>{{projectName}}</title>
-  </head>
-  <body>
-    <cer-layout-view></cer-layout-view>
-    <script type="module" src="/@cer/app.ts"></script>
-  </body>
-</html>

package/src/cli/create/templates/shared/tsconfig.json.tpl

@@ -1,6 +0,0 @@
-{
-  "compilerOptions": {
-    "lib": ["es2015", "dom"]
-  },
-  "extends": "./.cer/tsconfig.json"
-}

package/src/cli/create/templates/spa/cer.config.ts.tpl

@@ -1,6 +0,0 @@
-import { defineConfig } from '@jasonshimmy/vite-plugin-cer-app'
-
-export default defineConfig({
-  mode: 'spa',
-  autoImports: { components: true, composables: true, directives: true, runtime: true },
-})

package/src/cli/create/templates/spa/package.json.tpl

@@ -1,18 +0,0 @@
-{
-  "name": "{{projectName}}",
-  "version": "0.1.0",
-  "type": "module",
-  "scripts": {
-    "dev": "cer-app dev",
-    "build": "cer-app build",
-    "preview": "cer-app preview"
-  },
-  "dependencies": {
-    "@jasonshimmy/custom-elements-runtime": "^3.7.5"
-  },
-  "devDependencies": {
-    "@jasonshimmy/vite-plugin-cer-app": "^0.21.3",
-    "typescript": "^6.0.2",
-    "vite": "^8.0.8"
-  }
-}

package/src/cli/create/templates/ssg/cer.config.ts.tpl

@@ -1,10 +0,0 @@
-import { defineConfig } from '@jasonshimmy/vite-plugin-cer-app'
-
-export default defineConfig({
-  mode: 'ssg',
-  ssg: {
-    routes: 'auto',
-    concurrency: 4,
-  },
-  autoImports: { components: true, composables: true, directives: true, runtime: true },
-})

package/src/cli/create/templates/ssg/package.json.tpl

@@ -1,19 +0,0 @@
-{
-  "name": "{{projectName}}",
-  "version": "0.1.0",
-  "type": "module",
-  "scripts": {
-    "dev": "cer-app dev",
-    "build": "cer-app build",
-    "generate": "cer-app generate",
-    "preview": "cer-app preview"
-  },
-  "dependencies": {
-    "@jasonshimmy/custom-elements-runtime": "^3.7.5"
-  },
-  "devDependencies": {
-    "@jasonshimmy/vite-plugin-cer-app": "^0.21.3",
-    "typescript": "^6.0.2",
-    "vite": "^8.0.8"
-  }
-}

package/src/cli/create/templates/ssr/cer.config.ts.tpl

@@ -1,6 +0,0 @@
-import { defineConfig } from '@jasonshimmy/vite-plugin-cer-app'
-
-export default defineConfig({
-  mode: 'ssr',
-  autoImports: { components: true, composables: true, directives: true, runtime: true },
-})

package/src/cli/create/templates/ssr/package.json.tpl

@@ -1,18 +0,0 @@
-{
-  "name": "{{projectName}}",
-  "version": "0.1.0",
-  "type": "module",
-  "scripts": {
-    "dev": "cer-app dev",
-    "build": "cer-app build",
-    "preview": "cer-app preview --ssr"
-  },
-  "dependencies": {
-    "@jasonshimmy/custom-elements-runtime": "^3.7.5"
-  },
-  "devDependencies": {
-    "@jasonshimmy/vite-plugin-cer-app": "^0.21.3",
-    "typescript": "^6.0.2",
-    "vite": "^8.0.8"
-  }
-}

package/src/cli/index.ts

@@ -1,22 +0,0 @@
-#!/usr/bin/env node
-import { Command } from 'commander'
-import { devCommand } from './commands/dev.js'
-import { buildCommand } from './commands/build.js'
-import { previewCommand } from './commands/preview.js'
-import { generateCommand } from './commands/generate.js'
-import { adaptCommand } from './commands/adapt.js'
-
-const program = new Command()
-
-program
-  .name('cer-app')
-  .description('Nuxt-style meta-framework CLI for @jasonshimmy/custom-elements-runtime')
-  .version('0.1.0')
-
-program.addCommand(devCommand())
-program.addCommand(buildCommand())
-program.addCommand(previewCommand())
-program.addCommand(generateCommand())
-program.addCommand(adaptCommand())
-
-await program.parseAsync(process.argv)

package/src/index.ts

@@ -1,20 +0,0 @@
-// Main package entry
-export { cerApp } from './plugin/index.js'
-export { defineConfig } from './types/config.js'
-
-// Re-export all types
-export type { CerAppConfig, SsgConfig, JitCssConfig, AutoImportsConfig, AuthConfig, OAuthProviderConfig, OAuthTokens } from './types/config.js'
-export type { HydrateStrategy, SsgPathsContext, PageSsgConfig, PageMeta, PageLoaderContext, PageLoader } from './types/page.js'
-export type { ApiRequest, ApiResponse, ApiHandler, ApiContext } from './types/api.js'
-export type { AppContext, AppPlugin } from './types/plugin.js'
-export type { MiddlewareFn, GuardResult, ServerMiddleware } from './types/middleware.js'
-export type { SeoMetaInput } from './runtime/composables/use-seo-meta.js'
-export type { CookieOptions, CookieRef } from './runtime/composables/use-cookie.js'
-export type { AuthUser, AuthComposable } from './runtime/composables/use-auth.js'
-export type { UseFetchOptions, UseFetchReturn, UseFetchResult, UseFetchReactiveReturn } from './runtime/composables/use-fetch.js'
-
-// Re-export resolved config type for use in build scripts
-export type { ResolvedCerConfig } from './plugin/dev-server.js'
-
-// Content layer types
-export type { ContentItem, ContentMeta, ContentHeading, ContentSearchResult, CerContentConfig } from './types/content.js'