supaslidev 0.2.0 → 0.3.0

package/nuxt.config.ts

@@ -46,6 +46,7 @@ export default defineNuxtConfig({
     },
     public: {
       supaslidevVersion: pkg.version,
+      deployMode: false,
     },
   },
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "supaslidev",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "CLI toolkit for managing Supaslidev presentations",
   "keywords": [
     "slidev",
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@nuxt/ui": "^4.4.0",
-    "commander": "^13.1.0",
+    "commander": "^14.0.0",
     "js-yaml": "^4.1.1",
     "nuxt": "^4.4.2",
     "tailwindcss": "^4.1.18",
@@ -58,13 +58,13 @@
     "@nuxt/kit": "^4.4.2",
     "@nuxt/schema": "^4.4.2",
     "@types/js-yaml": "^4.0.9",
-    "@types/node": "^22.10.0",
-    "tsdown": "^0.12.5",
+    "@types/node": "^24.0.0",
+    "tsdown": "^0.21.6",
     "tsx": "^4.19.0",
-    "typescript": "^5.3.3",
+    "typescript": "^6.0.0",
     "vitest": "^4.0.0",
-    "vue-tsc": "^2.0.0",
-    "create-supaslidev": "^0.2.0"
+    "vue-tsc": "^3.0.0",
+    "create-supaslidev": "^0.3.0"
   },
   "scripts": {
     "dev": "nuxt dev",

package/server/api/presentations/import.post.ts

@@ -5,10 +5,10 @@ import {
   validateSourceDirectoryResult,
   SLUG_REGEX,
   copyDirectorySelective,
-  convertToCatalogDependencies,
   hasSharedPackage,
   addSharedDependencyToPackageJson,
   addSharedAddonToSlides,
+  normalizeVueToCatalog,
   regeneratePresentationsJson,
 } from '../../../src/shared/index.js';
 import { getProjectRoot, getPresentationsDir, getPresentationsJsonPath } from '../../utils/config';
@@ -82,12 +82,7 @@ export default defineEventHandler(async (event) => {
     export: 'slidev export',
   };
 
-  if (packageJson.dependencies) {
-    packageJson.dependencies = convertToCatalogDependencies(packageJson.dependencies);
-  }
-  if (packageJson.devDependencies) {
-    packageJson.devDependencies = convertToCatalogDependencies(packageJson.devDependencies);
-  }
+  normalizeVueToCatalog(packageJson);
 
   const sharedExists = hasSharedPackage(projectRoot);
   if (sharedExists) {

package/server/api/presentations/upload.post.ts

@@ -4,10 +4,10 @@ import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
 import {
   SLUG_REGEX,
   shouldIgnore,
-  convertToCatalogDependencies,
   hasSharedPackage,
   addSharedDependencyToPackageJson,
   addSharedAddonToSlides,
+  normalizeVueToCatalog,
   regeneratePresentationsJson,
 } from '../../../src/shared/index.js';
 import { getProjectRoot, getPresentationsDir, getPresentationsJsonPath } from '../../utils/config';
@@ -120,12 +120,7 @@ export default defineEventHandler(async (event) => {
     export: 'slidev export',
   };
 
-  if (packageJson.dependencies) {
-    packageJson.dependencies = convertToCatalogDependencies(packageJson.dependencies);
-  }
-  if (packageJson.devDependencies) {
-    packageJson.devDependencies = convertToCatalogDependencies(packageJson.devDependencies);
-  }
+  normalizeVueToCatalog(packageJson);
 
   const sharedExists = hasSharedPackage(projectRoot);
   if (sharedExists) {

package/src/cli/commands/deploy.ts

@@ -1,90 +1,263 @@
 import { spawn } from 'node:child_process';
-import { join } from 'node:path';
-import { existsSync, mkdirSync, cpSync, rmSync, writeFileSync } from 'node:fs';
-import {
-  findProjectRoot,
-  getPresentations,
-  printAvailablePresentations,
-  createVercelConfig,
-  createNetlifyConfig,
-  createDeployPackageJson,
-} from '../utils.js';
+import { join, dirname, resolve } from 'node:path';
+import { existsSync, mkdirSync, cpSync, rmSync, writeFileSync, readFileSync } from 'node:fs';
+import { fileURLToPath } from 'node:url';
+import { findProjectRoot, getPresentations } from '../utils.js';
+import { regeneratePresentationsJson } from '../../shared/presentations.js';
 
 export interface DeployOptions {
   output?: string;
+  base?: string;
 }
 
-export async function deploy(name: string, options: DeployOptions = {}): Promise<void> {
+function findSupaslidevPackageRoot(): string {
+  let dir = dirname(fileURLToPath(import.meta.url));
+
+  while (dir !== dirname(dir)) {
+    const packageJsonPath = join(dir, 'package.json');
+    if (existsSync(packageJsonPath)) {
+      try {
+        const pkg = JSON.parse(readFileSync(packageJsonPath, 'utf-8'));
+        if (pkg.name === 'supaslidev') {
+          return dir;
+        }
+      } catch {
+        // Continue searching
+      }
+    }
+    dir = dirname(dir);
+  }
+
+  throw new Error('Could not find supaslidev package root');
+}
+
+function runCommand(
+  command: string,
+  args: string[],
+  options: { cwd: string; env?: Record<string, string | undefined> },
+): Promise<void> {
+  return new Promise((resolve, reject) => {
+    const child = spawn(command, args, {
+      cwd: options.cwd,
+      stdio: 'inherit',
+      shell: process.platform === 'win32',
+      env: options.env ?? process.env,
+    });
+
+    child.on('error', (err) => {
+      reject(new Error(`Failed to run ${command}: ${err.message}`));
+    });
+
+    child.on('close', (code) => {
+      if (code !== 0) {
+        reject(new Error(`${command} exited with code ${code}`));
+      } else {
+        resolve();
+      }
+    });
+  });
+}
+
+function findNuxtBin(
+  projectRoot: string,
+  supaslidevRoot: string,
+): { command: string; args: string[] } {
+  const projectNuxtBin = join(projectRoot, 'node_modules', '.bin', 'nuxt');
+  const packageNuxtBin = join(supaslidevRoot, 'node_modules', '.bin', 'nuxt');
+
+  if (existsSync(projectNuxtBin)) {
+    return { command: projectNuxtBin, args: [] };
+  } else if (existsSync(packageNuxtBin)) {
+    return { command: packageNuxtBin, args: [] };
+  }
+  return { command: 'npx', args: ['nuxt'] };
+}
+
+export function createVercelConfig(basePath: string, presentations: string[]): string {
+  const rewrites = presentations.map((id) => ({
+    source: `${basePath}presentations/${id}/(.*)`,
+    destination: `${basePath}presentations/${id}/index.html`,
+  }));
+
+  rewrites.push({
+    source: `${basePath}(.*)`,
+    destination: `${basePath}index.html`,
+  });
+
+  return JSON.stringify({ rewrites }, null, 2);
+}
+
+export function createNetlifyConfig(basePath: string, presentations: string[]): string {
+  const lines = ['# Auto-generated by supaslidev deploy', ''];
+
+  for (const id of presentations) {
+    lines.push('[[redirects]]');
+    lines.push(`  from = "${basePath}presentations/${id}/*"`);
+    lines.push(`  to = "${basePath}presentations/${id}/index.html"`);
+    lines.push('  status = 200');
+    lines.push('');
+  }
+
+  lines.push('[[redirects]]');
+  lines.push(`  from = "${basePath}*"`);
+  lines.push(`  to = "${basePath}index.html"`);
+  lines.push('  status = 200');
+  lines.push('');
+
+  return lines.join('\n');
+}
+
+export function createDeployPackageJson(): string {
+  return JSON.stringify(
+    {
+      name: 'supaslidev-deploy',
+      private: true,
+      scripts: {
+        start: 'npx serve .',
+      },
+    },
+    null,
+    2,
+  );
+}
+
+export async function deploy(options: DeployOptions = {}): Promise<void> {
   const projectRoot = findProjectRoot();
 
   if (!projectRoot) {
-    console.error('Error: Could not find a Supaslidev project.');
-    console.error('Make sure you are in a directory with a "presentations" folder.');
-    process.exit(1);
+    throw new Error(
+      'Could not find a Supaslidev project. Make sure you are in a directory with a "presentations" folder.',
+    );
   }
 
   const presentationsDir = join(projectRoot, 'presentations');
-  const deployDir = join(projectRoot, 'deploy');
   const presentations = getPresentations(presentationsDir);
 
-  if (!presentations.includes(name)) {
-    console.error(`Error: Presentation "${name}" not found`);
-    printAvailablePresentations(presentations);
-    process.exit(1);
+  if (presentations.length === 0) {
+    throw new Error('No presentations found in the presentations directory.');
   }
 
-  const presentationDir = join(presentationsDir, name);
-  const presentationDistDir = join(presentationDir, 'dist');
-  const outputDir = options.output ?? join(deployDir, name);
-  const outputDistDir = join(outputDir, 'dist');
+  const outputDir = resolve(options.output ?? join(projectRoot, 'deploy'));
+  const resolvedProjectRoot = resolve(projectRoot);
+
+  // Safety check: prevent deleting directories outside the project root
+  if (!outputDir.startsWith(resolvedProjectRoot)) {
+    throw new Error(
+      `Output directory "${outputDir}" is outside the project root "${resolvedProjectRoot}". Use a path within your project.`,
+    );
+  }
+  const basePath = (options.base ?? '/').replace(/\/*$/, '/');
+
+  const supaslidevRoot = findSupaslidevPackageRoot();
+  const presentationsJsonPath = join(projectRoot, '.supaslidev', 'presentations.json');
 
   console.log('\n' + '='.repeat(50));
-  console.log(`  Preparing deployment: ${name}`);
-  console.log('='.repeat(50) + '\n');
+  console.log('  Supaslidev Deploy');
+  console.log('='.repeat(50));
+  console.log(`\n  Project: ${projectRoot}`);
+  console.log(`  Output:  ${outputDir}`);
+  console.log(`  Base:    ${basePath}`);
+  console.log(`  Presentations: ${presentations.join(', ')}`);
+  console.log('');
 
-  console.log('Step 1/3: Building presentation...');
+  // Step 1: Build each presentation with slidev build --base
+  console.log(`Step 1/${4}: Building ${presentations.length} presentation(s)...\n`);
 
-  const slidev = spawn('npx', ['slidev', 'build'], {
-    cwd: presentationDir,
-    stdio: 'inherit',
-    shell: true,
-  });
+  for (const id of presentations) {
+    const presentationDir = join(presentationsDir, id);
+    const presentationBase = `${basePath}presentations/${id}/`;
 
-  slidev.on('error', (err) => {
-    console.error(`Failed to build presentation: ${err.message}`);
-    process.exit(1);
-  });
+    console.log(`  Building: ${id} (base: ${presentationBase})`);
 
-  slidev.on('close', (code) => {
-    if (code !== 0) {
-      console.error(`\nBuild failed with exit code ${code}`);
-      process.exit(code ?? 1);
-    }
+    await runCommand('npx', ['slidev', 'build', '--base', presentationBase], {
+      cwd: presentationDir,
+    });
+
+    console.log(`  Done: ${id}\n`);
+  }
+
+  // Step 2: Generate presentations.json
+  console.log('Step 2/4: Generating presentations.json...\n');
+
+  regeneratePresentationsJson(presentationsDir, presentationsJsonPath);
+
+  // Step 3: Build the Nuxt dashboard in static mode
+  console.log('Step 3/4: Building dashboard...\n');
 
-    console.log('\nStep 2/3: Creating deploy package...');
+  const nuxt = findNuxtBin(projectRoot, supaslidevRoot);
 
-    if (existsSync(outputDir)) {
-      rmSync(outputDir, { recursive: true });
+  const nuxtEnv: Record<string, string | undefined> = {
+    ...process.env,
+    NODE_ENV: 'production',
+    SUPASLIDEV_PROJECT_ROOT: projectRoot,
+    SUPASLIDEV_PRESENTATIONS_DIR: presentationsDir,
+    NUXT_PUBLIC_DEPLOY_MODE: 'true',
+  };
+
+  // Strip test runner env vars
+  for (const key of Object.keys(nuxtEnv)) {
+    if (key === 'VITEST' || key.startsWith('VITEST_') || key === 'TEST') {
+      delete nuxtEnv[key];
     }
-    mkdirSync(outputDir, { recursive: true });
-
-    cpSync(presentationDistDir, outputDistDir, { recursive: true });
-
-    console.log('Step 3/3: Adding deployment configurations...');
-
-    writeFileSync(join(outputDir, 'vercel.json'), createVercelConfig());
-    writeFileSync(join(outputDir, 'netlify.toml'), createNetlifyConfig());
-    writeFileSync(join(outputDir, 'package.json'), createDeployPackageJson(name));
-
-    console.log('\n' + '='.repeat(50));
-    console.log('  Deployment package ready!');
-    console.log('='.repeat(50));
-    console.log(`\n  Output: ${outputDir}/`);
-    console.log('\n  Deploy with Vercel:');
-    console.log(`    cd ${outputDir} && vercel`);
-    console.log('\n  Deploy with Netlify:');
-    console.log(`    cd ${outputDir} && netlify deploy --prod`);
-    console.log('\n  Or push to Git and import in Vercel/Netlify dashboard.');
-    console.log('');
+  }
+
+  await runCommand(nuxt.command, [...nuxt.args, 'generate'], {
+    cwd: supaslidevRoot,
+    env: nuxtEnv,
   });
+
+  // Step 4: Assemble output directory
+  console.log('\nStep 4/4: Assembling deploy output...\n');
+
+  // Clean and create output directory
+  if (existsSync(outputDir)) {
+    rmSync(outputDir, { recursive: true });
+  }
+  mkdirSync(outputDir, { recursive: true });
+
+  // Copy Nuxt output — nuxt generate runs in supaslidevRoot so .output lands there
+  const nuxtOutputDir = join(supaslidevRoot, '.output', 'public');
+  if (existsSync(nuxtOutputDir)) {
+    cpSync(nuxtOutputDir, outputDir, { recursive: true });
+  } else {
+    throw new Error('Nuxt generate did not produce output at .output/public/');
+  }
+
+  // Copy each presentation's dist into output/presentations/<id>/
+  const presentationsOutputDir = join(outputDir, 'presentations');
+  mkdirSync(presentationsOutputDir, { recursive: true });
+
+  for (const id of presentations) {
+    const distDir = join(presentationsDir, id, 'dist');
+    const destDir = join(presentationsOutputDir, id);
+
+    if (existsSync(distDir)) {
+      cpSync(distDir, destDir, { recursive: true });
+    } else {
+      console.warn(`  Warning: No dist/ found for presentation "${id}", skipping.`);
+    }
+  }
+
+  // Copy presentations.json to output root
+  if (existsSync(presentationsJsonPath)) {
+    cpSync(presentationsJsonPath, join(outputDir, 'presentations.json'));
+  }
+
+  // Generate platform config files
+  writeFileSync(join(outputDir, 'vercel.json'), createVercelConfig(basePath, presentations));
+  writeFileSync(join(outputDir, 'netlify.toml'), createNetlifyConfig(basePath, presentations));
+  writeFileSync(join(outputDir, 'package.json'), createDeployPackageJson());
+
+  console.log('='.repeat(50));
+  console.log('  Deploy package ready!');
+  console.log('='.repeat(50));
+  console.log(`\n  Output: ${outputDir}/`);
+  console.log(`\n  Preview locally:`);
+  console.log(`    cd ${outputDir} && npx serve .`);
+  console.log(`\n  Deploy with Vercel:`);
+  console.log(`    cd ${outputDir} && vercel`);
+  console.log(`\n  Deploy with Netlify:`);
+  console.log(`    cd ${outputDir} && netlify deploy --prod`);
+  console.log(`\n  Or push to Git and import in Vercel/Netlify dashboard.`);
+  console.log('');
 }

package/src/cli/commands/import.ts

@@ -11,6 +11,7 @@ import {
   hasSharedPackage,
   addSharedAddonToSlides,
   addSharedDependencyToPackageJson,
+  normalizeVueToCatalog,
 } from '../../shared/index.js';
 import type { PackageJson } from '../../shared/types.js';
 
@@ -52,6 +53,8 @@ export function transformPackageJson(
     export: 'slidev export',
   };
 
+  normalizeVueToCatalog(packageJson);
+
   if (hasSharedPackage(projectRoot)) {
     addSharedDependencyToPackageJson(packageJson);
   }

package/src/cli/index.ts

@@ -5,8 +5,8 @@ import { dev } from './commands/dev.js';
 import { create } from './commands/create.js';
 import { present } from './commands/present.js';
 import { exportPdf } from './commands/export.js';
-import { deploy } from './commands/deploy.js';
 import { importPresentation } from './commands/import.js';
+import { deploy } from './commands/deploy.js';
 
 const program = new Command();
 
@@ -44,15 +44,6 @@ program
     await exportPdf(name, options);
   });
 
-program
-  .command('deploy')
-  .description('Build and prepare a presentation for deployment')
-  .argument('<name>', 'Name of the presentation to deploy')
-  .option('-o, --output <path>', 'Output directory for deployment files')
-  .action(async (name: string, options: { output?: string }) => {
-    await deploy(name, options);
-  });
-
 program
   .command('import')
   .description('Import existing Sli.dev presentation(s)')
@@ -66,6 +57,20 @@ program
     await importPresentation(source, { name: options.name, install: options.install ?? true });
   });
 
+program
+  .command('deploy')
+  .description('Build all presentations into a static deployable site')
+  .option('-o, --output <dir>', 'Output directory for the deploy package')
+  .option('--base <path>', 'Base path for the deployed site (default: /)')
+  .action(async (options: { output?: string; base?: string }) => {
+    try {
+      await deploy(options);
+    } catch (error) {
+      console.error(`Error: ${error instanceof Error ? error.message : error}`);
+      process.exit(1);
+    }
+  });
+
 export async function run(): Promise<void> {
   await program.parseAsync();
 }

package/src/cli/utils.ts

@@ -45,50 +45,3 @@ export function printAvailablePresentations(presentations: string[]): void {
     }
   }
 }
-
-export function createVercelConfig(): string {
-  return (
-    JSON.stringify(
-      {
-        buildCommand: 'npm run build',
-        outputDirectory: 'dist',
-        rewrites: [{ source: '/(.*)', destination: '/index.html' }],
-      },
-      null,
-      2,
-    ) + '\n'
-  );
-}
-
-export function createNetlifyConfig(): string {
-  return `[build]
-publish = "dist"
-command = "npm run build"
-
-[build.environment]
-NODE_VERSION = "20"
-
-[[redirects]]
-from = "/*"
-to = "/index.html"
-status = 200
-`;
-}
-
-export function createDeployPackageJson(name: string): string {
-  return (
-    JSON.stringify(
-      {
-        name: `${name}-deploy`,
-        version: '1.0.0',
-        private: true,
-        scripts: {
-          build: 'echo "Already built - static files ready in dist/"',
-          start: 'npx serve dist',
-        },
-      },
-      null,
-      2,
-    ) + '\n'
-  );
-}

package/src/module.ts

@@ -1,6 +1,7 @@
+import type { NuxtModule } from '@nuxt/schema';
 import { defineNuxtModule } from '@nuxt/kit';
 
-export default defineNuxtModule({
+const supaslidevModule: NuxtModule = defineNuxtModule({
   meta: {
     name: 'supaslidev',
     configKey: 'supaslidev',
@@ -10,3 +11,5 @@ export default defineNuxtModule({
     // This module is a placeholder for future supaslidev-specific setup
   },
 });
+
+export default supaslidevModule;

package/src/shared/catalog.ts

@@ -2,14 +2,6 @@ import { existsSync, readFileSync, writeFileSync } from 'node:fs';
 import { join } from 'node:path';
 import type { PackageJson } from './types.js';
 
-export const CATALOG_DEPENDENCIES = [
-  '@slidev/cli',
-  '@slidev/theme-default',
-  '@slidev/theme-seriph',
-  '@slidev/theme-apple-basic',
-  'vue',
-];
-
 export function hasSharedPackage(projectRoot: string): boolean {
   const sharedPackagePath = join(projectRoot, 'packages', 'shared', 'package.json');
   return existsSync(sharedPackagePath);
@@ -78,17 +70,11 @@ export function addSharedDependencyToPackageJson(packageJson: PackageJson): void
   }
 }
 
-export function convertToCatalogDependencies(
-  dependencies: Record<string, string>,
-): Record<string, string> {
-  if (!dependencies || typeof dependencies !== 'object') {
-    return {};
+export function normalizeVueToCatalog(packageJson: PackageJson): void {
+  if (packageJson.dependencies?.['vue']) {
+    packageJson.dependencies['vue'] = 'catalog:';
   }
-  const converted = { ...dependencies };
-  for (const dep of CATALOG_DEPENDENCIES) {
-    if (dep in converted) {
-      converted[dep] = 'catalog:';
-    }
+  if (packageJson.devDependencies?.['vue']) {
+    packageJson.devDependencies['vue'] = 'catalog:';
   }
-  return converted;
 }

package/src/shared/index.ts

@@ -19,11 +19,10 @@ export {
 } from './presentations.js';
 
 export {
-  CATALOG_DEPENDENCIES,
   hasSharedPackage,
   addSharedAddonToSlides,
   addSharedDependencyToPackageJson,
-  convertToCatalogDependencies,
+  normalizeVueToCatalog,
 } from './catalog.js';
 
 export { copyDirectorySelective } from './copy.js';