basecampjs 0.0.7 → 0.0.9

package/index.js

@@ -4,7 +4,7 @@ import { createServer } from "http";
 import { existsSync } from "fs";
 import { cp, mkdir, readFile, readdir, rename, rm, stat, writeFile } from "fs/promises";
 import { basename, dirname, extname, join, relative, resolve } from "path";
-import { pathToFileURL } from "url";
+import { pathToFileURL, fileURLToPath } from "url";
 import { createHash } from "crypto";
 import * as kolor from "kolorist";
 import chokidar from "chokidar";
@@ -17,6 +17,7 @@ import { minify as minifyCss } from "csso";
 import { minify as minifyHtml } from "html-minifier-terser";
 
 const cwd = process.cwd();
+const __dirname = dirname(fileURLToPath(import.meta.url));
 const md = new MarkdownIt({ html: true, linkify: true, typographer: true });
 
 const defaultConfig = {
@@ -44,22 +45,96 @@ async function loadConfig(root) {
   }
 }
 
+async function getVersion() {
+  try {
+    const pkgPath = join(__dirname, "package.json");
+    const raw = await readFile(pkgPath, "utf8");
+    const pkg = JSON.parse(raw);
+    return pkg.version || "0.0.0";
+  } catch {
+    return "0.0.0";
+  }
+}
+
+function showHelp() {
+  console.log(kolor.cyan(kolor.bold("\n🏕️  CampsiteJS CLI")));
+  console.log(kolor.dim("Build and manage your static campsite.\n"));
+  
+  console.log(kolor.bold("Usage:"));
+  console.log("  campsite <command> [arguments] [options]\n");
+  
+  console.log(kolor.bold("Project Commands:"));
+  console.log("  " + kolor.cyan("init") + "              Initialize a new Campsite project in current directory");
+  console.log("                    Creates config, folder structure, and starter files\n");
+  
+  console.log(kolor.bold("Development Commands:"));
+  console.log("  " + kolor.cyan("dev") + "               Start development server with hot reloading");
+  console.log("                    Watches for file changes and rebuilds automatically");
+  console.log("  " + kolor.cyan("build") + "             Build your site for production");
+  console.log("                    Optimizes and outputs to dist/ directory");
+  console.log("  " + kolor.cyan("serve") + "             Serve the built site locally");
+  console.log("                    Serves from dist/ folder on http://localhost:4173");
+  console.log("  " + kolor.cyan("preview") + "           Build and serve in production mode");
+  console.log("                    Combines build + serve for testing production output\n");
+  
+  console.log(kolor.bold("Utility Commands:"));
+  console.log("  " + kolor.cyan("list") + "              List all content (pages, layouts, components, etc.)");
+  console.log("                    Overview of your project structure");
+  console.log("  " + kolor.cyan("clean") + "             Remove build output directory");
+  console.log("                    Deletes dist/ folder for a fresh build");
+  console.log("  " + kolor.cyan("check") + "             Validate config and check for issues");
+  console.log("                    Diagnoses project structure and dependencies");
+  console.log("  " + kolor.cyan("upgrade") + "           Update CampsiteJS to the latest version");
+  console.log("                    Checks and upgrades basecampjs and dependencies\n");
+  
+  console.log(kolor.bold("Make Commands:"));
+  console.log("  " + kolor.cyan("make:page") + " " + kolor.dim("<name>") + "    Create a new page in src/pages/");
+  console.log("  " + kolor.cyan("make:post") + " " + kolor.dim("<name>") + "    Create a new blog post in src/pages/blog/");
+  console.log("  " + kolor.cyan("make:layout") + " " + kolor.dim("<name>") + "  Create a new layout in src/layouts/");
+  console.log("  " + kolor.cyan("make:component") + " " + kolor.dim("<name>") + " Create a new component in src/components/");
+  console.log("  " + kolor.cyan("make:partial") + " " + kolor.dim("<name>") + " Create a new partial in src/partials/");
+  console.log("  " + kolor.cyan("make:collection") + " " + kolor.dim("<name>") + " Create a new JSON collection in src/collections/\n");
+  
+  console.log(kolor.bold("Options:"));
+  console.log("  -h, --help        Show this help message");
+  console.log("  -v, --version     Show version number\n");
+  
+  console.log(kolor.bold("Examples:"));
+  console.log("  " + kolor.dim("# Initialize a new project"));
+  console.log("  campsite init\n");
+  console.log("  " + kolor.dim("# Start development"));
+  console.log("  campsite dev\n");
+  console.log("  " + kolor.dim("# Create new content"));
+  console.log("  campsite make:page about");
+  console.log("  campsite make:post \"My First Post\"");
+  console.log("  campsite make:collection products\n");
+  console.log("  " + kolor.dim("# Build and preview"));
+  console.log("  campsite preview\n");
+  console.log(kolor.dim("For more information, visit: https://campsitejs.dev"));
+  console.log();
+}
+
 async function ensureDir(dir) {
   await mkdir(dir, { recursive: true });
 }
 
-async function loadData(dataDir) {
+async function loadData(dataDirs) {
   const collections = {};
-  if (!existsSync(dataDir)) return collections;
-  const files = await walkFiles(dataDir);
-  for (const file of files) {
-    if (extname(file).toLowerCase() !== ".json") continue;
-    const name = basename(file, ".json");
-    try {
-      const raw = await readFile(file, "utf8");
-      collections[name] = JSON.parse(raw);
-    } catch (err) {
-      console.error(kolor.red(`Failed to load data ${relative(dataDir, file)}: ${err.message}`));
+  // Support both string and array input
+  const dirs = Array.isArray(dataDirs) ? dataDirs : [dataDirs];
+  
+  for (const dataDir of dirs) {
+    if (!existsSync(dataDir)) continue;
+    const files = await walkFiles(dataDir);
+    for (const file of files) {
+      if (extname(file).toLowerCase() !== ".json") continue;
+      const name = basename(file, ".json");
+      try {
+        const raw = await readFile(file, "utf8");
+        collections[name] = JSON.parse(raw);
+      } catch (err) {
+        console.error(kolor.red(`Failed to load data ${relative(dataDir, file)}: ${err.message}`));
+      }
     }
   }
   return collections;
@@ -371,6 +446,7 @@ async function build(cwdArg = cwd) {
   const layoutsDir = join(srcDir, "layouts");
   const partialsDir = join(srcDir, "partials");
   const dataDir = join(srcDir, "data");
+  const collectionsDir = join(srcDir, "collections");
   const publicDir = resolve(cwdArg, "public");
   const outDir = resolve(cwdArg, config.outDir || "dist");
   const env = createNunjucksEnv(layoutsDir, pagesDir, srcDir, partialsDir);
@@ -391,7 +467,7 @@ async function build(cwdArg = cwd) {
       console.error(kolor.red(`Failed to apply liquidEnv hook: ${err.message}`));
     }
   }
-  const data = await loadData(dataDir);
+  const data = await loadData([dataDir, collectionsDir]);
 
   await cleanDir(outDir);
   await copyPublic(publicDir, outDir);
@@ -514,9 +590,10 @@ async function dev(cwdArg = cwd) {
   const config = await loadConfig(cwdArg);
   const srcDir = resolve(cwdArg, config.srcDir || "src");
   const dataDir = join(srcDir, "data");
+  const collectionsDir = join(srcDir, "collections");
   const publicDir = resolve(cwdArg, "public");
   const outDir = resolve(cwdArg, config.outDir || "dist");
-  const watcher = chokidar.watch([srcDir, publicDir, dataDir], { ignoreInitial: true });
+  const watcher = chokidar.watch([srcDir, publicDir, dataDir, collectionsDir], { ignoreInitial: true });
 
   watcher.on("all", (event, path) => {
     console.log(kolor.cyan(`↻ ${event}: ${relative(cwdArg, path)}`));
@@ -526,10 +603,683 @@ async function dev(cwdArg = cwd) {
   serve(outDir);
 }
 
+function slugify(text) {
+  return text
+    .toLowerCase()
+    .trim()
+    .replace(/[^\w\s-]/g, "")
+    .replace(/[\s_-]+/g, "-")
+    .replace(/^-+|-+$/g, "");
+}
+
+function formatDate(date) {
+  return date.toISOString().split("T")[0];
+}
+
+async function makeContent(type) {
+  // Get all arguments after the command and join them
+  const args = argv.slice(3);
+  
+  if (args.length === 0) {
+    console.log(kolor.red("❌ Missing name argument"));
+    console.log(kolor.dim(`Usage: campsite make:${type} <name> [name2, name3, ...]`));
+    console.log(kolor.dim("\nExamples:"));
+    console.log(kolor.dim("  campsite make:page about"));
+    console.log(kolor.dim("  campsite make:page home, about, contact"));
+    console.log(kolor.dim("  campsite make:collection products, categories\n"));
+    exit(1);
+  }
+
+  // Join all args and split by comma to support both formats:
+  // campsite make:page home about contact
+  // campsite make:page home, about, contact
+  const namesString = args.join(" ");
+  const names = namesString.split(",").map(n => n.trim()).filter(n => n.length > 0);
+
+  if (names.length === 0) {
+    console.log(kolor.red("❌ No valid names provided\n"));
+    exit(1);
+  }
+
+  console.log(kolor.cyan(`\n🏕️  Creating ${names.length} ${type}(s)...\n`));
+
+  const config = await loadConfig(cwd);
+  const srcDir = resolve(cwd, config.srcDir || "src");
+
+  // Determine file extension based on template engine
+  const engineExtMap = {
+    nunjucks: ".njk",
+    liquid: ".liquid",
+    mustache: ".mustache"
+  };
+  const defaultExt = engineExtMap[config.templateEngine] || ".njk";
+
+  let successCount = 0;
+  let skipCount = 0;
+
+  for (const name of names) {
+    const result = await createSingleContent(type, name, srcDir, config, defaultExt);
+    if (result.success) successCount++;
+    if (result.skipped) skipCount++;
+  }
+
+  console.log();
+  if (successCount > 0) {
+    console.log(kolor.green(`✅ Created ${successCount} ${type}(s)`));
+  }
+  if (skipCount > 0) {
+    console.log(kolor.yellow(`⚠️  Skipped ${skipCount} existing file(s)`));
+  }
+  console.log(kolor.dim("\n🌲 Happy camping!\n"));
+}
+
+async function createSingleContent(type, name, srcDir, config, defaultExt) {
+  // Check if user provided an extension
+  const hasExtension = name.includes(".");
+  const providedExt = hasExtension ? extname(name) : null;
+  const nameWithoutExt = hasExtension ? basename(name, providedExt) : name;
+  
+  const slug = slugify(nameWithoutExt);
+  const today = formatDate(new Date());
+  const title = nameWithoutExt.charAt(0).toUpperCase() + nameWithoutExt.slice(1);
+
+  let targetPath;
+  let content;
+  let fileExt;
+
+  switch (type.toLowerCase()) {
+    case "page": {
+      // Priority: provided extension > template engine
+      if (providedExt) {
+        fileExt = providedExt;
+      } else {
+        fileExt = defaultExt;
+      }
+      
+      targetPath = join(srcDir, "pages", `${slug}${fileExt}`);
+      
+      // Determine if we should use markdown content based on extension
+      const useMarkdown = fileExt === ".md";
+      
+      if (useMarkdown) {
+        content = `---
+layout: base${defaultExt}
+title: ${title}
+---
+
+# ${title}
+
+Your new page content goes here.
+`;
+      } else {
+        content = `---
+layout: base${defaultExt}
+title: ${title}
+---
+
+<h1>${title}</h1>
+<p>Your new page content goes here.</p>
+`;
+      }
+      break;
+    }
+
+    case "post": {
+      const postsDir = join(srcDir, "pages", "blog");
+      await ensureDir(postsDir);
+      
+      if (providedExt) {
+        fileExt = providedExt;
+      } else {
+        fileExt = defaultExt;
+      }
+      
+      targetPath = join(postsDir, `${slug}${fileExt}`);
+      
+      const useMarkdown = fileExt === ".md";
+      
+      if (useMarkdown) {
+        content = `---
+layout: base${defaultExt}
+title: ${title}
+date: ${today}
+author: Your Name
+---
+
+# ${title}
+
+Your blog post content goes here.
+`;
+      } else {
+        content = `---
+layout: base${defaultExt}
+title: ${title}
+date: ${today}
+author: Your Name
+---
+
+<h1>${title}</h1>
+<p>Your blog post content goes here.</p>
+`;
+      }
+      break;
+    }
+
+    case "layout": {
+      const layoutsDir = join(srcDir, "layouts");
+      await ensureDir(layoutsDir);
+      targetPath = join(layoutsDir, `${slug}.njk`);
+      fileExt = ".njk";
+      content = `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>{{ title or site.name }}</title>
+  <link rel="stylesheet" href="/style.css">
+</head>
+<body>
+  <main>
+    {% block content %}
+    {{ content | safe }}
+    {% endblock %}
+  </main>
+</body>
+</html>
+`;
+      break;
+    }
+
+    case "component": {
+      const componentsDir = join(srcDir, "components");
+      await ensureDir(componentsDir);
+      targetPath = join(componentsDir, `${slug}.njk`);
+      fileExt = ".njk";
+      content = `{# ${title} Component #}
+<div class="${slug}">
+  {{ content | safe }}
+</div>
+`;
+      break;
+    }
+
+    case "partial": {
+      const partialsDir = join(srcDir, "partials");
+      await ensureDir(partialsDir);
+      targetPath = join(partialsDir, `${slug}.njk`);
+      fileExt = ".njk";
+      content = `{# ${title} Partial #}
+<div class="${slug}">
+  {# Your partial content here #}
+</div>
+`;
+      break;
+    }
+
+    case "collection": {
+      const collectionsDir = join(srcDir, "collections");
+      await ensureDir(collectionsDir);
+      targetPath = join(collectionsDir, `${slug}.json`);
+      fileExt = ".json";
+      content = `[
+  {
+    "id": 1,
+    "title": "Sample ${title} Item",
+    "description": "Add your collection items here"
+  }
+]
+`;
+      break;
+    }
+
+    default:
+      console.log(kolor.red(`❌ Unknown content type: ${type}`));
+      console.log(kolor.dim("\nSupported types: page, post, layout, component, partial, collection\n"));
+      return { success: false, skipped: false };
+  }
+
+  if (existsSync(targetPath)) {
+    console.log(kolor.dim(`  ⚠️  Skipped ${relative(cwd, targetPath)} (already exists)`));
+    return { success: false, skipped: true };
+  }
+
+  await ensureDir(dirname(targetPath));
+  await writeFile(targetPath, content, "utf8");
+
+  console.log(kolor.dim(`  ✅ ${relative(cwd, targetPath)}`));
+  return { success: true, skipped: false };
+}
+
+async function init() {
+  const targetDir = cwd;
+  console.log(kolor.cyan(kolor.bold("🏕️  Initializing Campsite in current directory...")));
+
+  // Check if already initialized
+  if (existsSync(join(targetDir, "campsite.config.js"))) {
+    console.log(kolor.yellow("⚠️  This directory already has a campsite.config.js file."));
+    console.log(kolor.dim("Run 'campsite dev' to start developing.\n"));
+    return;
+  }
+
+  // Create basic structure
+  const dirs = [
+    join(targetDir, "src", "pages"),
+    join(targetDir, "src", "layouts"),
+    join(targetDir, "public")
+  ];
+
+  for (const dir of dirs) {
+    await ensureDir(dir);
+  }
+
+  // Create basic config file
+  const configContent = `export default {
+  siteName: "My Campsite",
+  srcDir: "src",
+  outDir: "dist",
+  templateEngine: "nunjucks",
+  markdown: true,
+  integrations: {
+    nunjucks: true,
+    liquid: false,
+    mustache: false,
+    vue: false,
+    alpine: false
+  }
+};
+`;
+  await writeFile(join(targetDir, "campsite.config.js"), configContent, "utf8");
+
+  // Create basic layout
+  const layoutContent = `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>{{ title or site.name }}</title>
+  <link rel="stylesheet" href="/style.css">
+</head>
+<body>
+  {% block content %}
+  {{ content | safe }}
+  {% endblock %}
+</body>
+</html>
+`;
+  await writeFile(join(targetDir, "src", "layouts", "base.njk"), layoutContent, "utf8");
+
+  // Create sample page
+  const pageContent = `---
+layout: base.njk
+title: Welcome to Campsite
+---
+
+# Welcome to Campsite! 🏕️
+
+Your cozy static site is ready to build.
+
+## Get Started
+
+- Run \`campsite dev\` to start developing
+- Edit pages in \`src/pages/\`
+- Customize layouts in \`src/layouts/\`
+
+Happy camping! 🌲🦊
+`;
+  await writeFile(join(targetDir, "src", "pages", "index.md"), pageContent, "utf8");
+
+  // Create basic CSS
+  const cssContent = `* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: system-ui, -apple-system, sans-serif;
+  line-height: 1.6;
+  padding: 2rem;
+  max-width: 800px;
+  margin: 0 auto;
+}
+
+h1 { color: #2d5016; margin-bottom: 1rem; }
+h2 { color: #4a7c2c; margin-top: 1.5rem; }
+`;
+  await writeFile(join(targetDir, "public", "style.css"), cssContent, "utf8");
+
+  // Create .gitignore
+  const gitignoreContent = `node_modules/
+dist/
+.DS_Store
+`;
+  await writeFile(join(targetDir, ".gitignore"), gitignoreContent, "utf8");
+
+  // Create package.json
+  const packageJson = {
+    name: basename(targetDir),
+    version: "0.0.1",
+    type: "module",
+    scripts: {
+      dev: "campsite dev",
+      build: "campsite build",
+      serve: "campsite serve",
+      preview: "campsite preview"
+    },
+    dependencies: {
+      basecampjs: "^0.0.8"
+    }
+  };
+  await writeFile(join(targetDir, "package.json"), JSON.stringify(packageJson, null, 2), "utf8");
+
+  console.log(kolor.green("✅ Campsite initialized successfully!\n"));
+  console.log(kolor.bold("Next steps:"));
+  console.log(kolor.dim("  1. Install dependencies: npm install"));
+  console.log(kolor.dim("  2. Start developing: campsite dev\n"));
+}
+
+async function clean() {
+  const config = await loadConfig(cwd);
+  const outDir = resolve(cwd, config.outDir || "dist");
+
+  if (!existsSync(outDir)) {
+    console.log(kolor.dim(`Nothing to clean. ${outDir} does not exist.`));
+    return;
+  }
+
+  console.log(kolor.cyan(`🧹 Cleaning ${relative(cwd, outDir)}...`));
+  await rm(outDir, { recursive: true, force: true });
+  console.log(kolor.green(`✅ Cleaned ${relative(cwd, outDir)}\n`));
+}
+
+async function check() {
+  console.log(kolor.cyan(kolor.bold("🔍 Checking Campsite project...\n")));
+  let hasIssues = false;
+
+  // Check if campsite.config.js exists
+  const configPath = join(cwd, "campsite.config.js");
+  if (!existsSync(configPath)) {
+    console.log(kolor.red("❌ campsite.config.js not found"));
+    console.log(kolor.dim("   Run 'campsite init' to initialize a project\n"));
+    hasIssues = true;
+  } else {
+    console.log(kolor.green("✅ campsite.config.js found"));
+  }
+
+  // Load and validate config
+  const config = await loadConfig(cwd);
+  const srcDir = resolve(cwd, config.srcDir || "src");
+  const pagesDir = join(srcDir, "pages");
+  const layoutsDir = join(srcDir, "layouts");
+  const publicDir = resolve(cwd, "public");
+
+  // Check src directory
+  if (!existsSync(srcDir)) {
+    console.log(kolor.red(`❌ Source directory not found: ${relative(cwd, srcDir)}`));
+    hasIssues = true;
+  } else {
+    console.log(kolor.green(`✅ Source directory exists: ${relative(cwd, srcDir)}`));
+  }
+
+  // Check pages directory
+  if (!existsSync(pagesDir)) {
+    console.log(kolor.yellow(`⚠️  Pages directory not found: ${relative(cwd, pagesDir)}`));
+    hasIssues = true;
+  } else {
+    const files = await walkFiles(pagesDir);
+    if (files.length === 0) {
+      console.log(kolor.yellow(`⚠️  No pages found in ${relative(cwd, pagesDir)}`));
+      hasIssues = true;
+    } else {
+      console.log(kolor.green(`✅ Found ${files.length} page(s) in ${relative(cwd, pagesDir)}`));
+    }
+  }
+
+  // Check layouts directory
+  if (existsSync(layoutsDir)) {
+    const layouts = await readdir(layoutsDir).catch(() => []);
+    console.log(kolor.green(`✅ Found ${layouts.length} layout(s) in ${relative(cwd, layoutsDir)}`));
+  } else {
+    console.log(kolor.dim(`ℹ️  No layouts directory (${relative(cwd, layoutsDir)})`));
+  }
+
+  // Check public directory
+  if (existsSync(publicDir)) {
+    console.log(kolor.green(`✅ Public directory exists: ${relative(cwd, publicDir)}`));
+  } else {
+    console.log(kolor.dim(`ℹ️  No public directory (${relative(cwd, publicDir)})`));
+  }
+
+  // Check for package.json and dependencies
+  const pkgPath = join(cwd, "package.json");
+  if (existsSync(pkgPath)) {
+    try {
+      const pkgRaw = await readFile(pkgPath, "utf8");
+      const pkg = JSON.parse(pkgRaw);
+      if (pkg.dependencies?.basecampjs || pkg.devDependencies?.basecampjs) {
+        console.log(kolor.green("✅ basecampjs dependency found"));
+      } else {
+        console.log(kolor.yellow("⚠️  basecampjs not listed in dependencies"));
+        console.log(kolor.dim("   Consider adding: npm install basecampjs"));
+      }
+    } catch {
+      console.log(kolor.yellow("⚠️  Could not parse package.json"));
+    }
+  } else {
+    console.log(kolor.dim("ℹ️  No package.json found"));
+  }
+
+  console.log();
+  if (hasIssues) {
+    console.log(kolor.yellow("⚠️  Some issues found. Review the messages above."));
+  } else {
+    console.log(kolor.green(kolor.bold("🎉 Everything looks good! Ready to build.")));
+  }
+  console.log();
+}
+
+async function upgrade() {
+  console.log(kolor.cyan(kolor.bold("⬆️  Checking for CampsiteJS updates...\n")));
+
+  // Check if package.json exists
+  const pkgPath = join(cwd, "package.json");
+  if (!existsSync(pkgPath)) {
+    console.log(kolor.red("❌ package.json not found"));
+    console.log(kolor.dim("This command should be run in a Campsite project directory.\n"));
+    exit(1);
+  }
+
+  // Read current package.json
+  let pkg;
+  try {
+    const pkgRaw = await readFile(pkgPath, "utf8");
+    pkg = JSON.parse(pkgRaw);
+  } catch {
+    console.log(kolor.red("❌ Could not read package.json\n"));
+    exit(1);
+  }
+
+  const currentVersion = pkg.dependencies?.basecampjs || pkg.devDependencies?.basecampjs;
+  if (!currentVersion) {
+    console.log(kolor.yellow("⚠️  basecampjs not found in dependencies"));
+    console.log(kolor.dim("Install it with: npm install basecampjs\n"));
+    exit(1);
+  }
+
+  console.log(kolor.dim(`Current version: ${currentVersion}`));
+  console.log(kolor.cyan("\nUpgrading basecampjs to latest version...\n"));
+
+  // Use dynamic import to run npm commands
+  const { spawn } = await import("child_process");
+  
+  return new Promise((resolve, reject) => {
+    const child = spawn("npm", ["install", "basecampjs@latest"], {
+      cwd,
+      stdio: "inherit",
+      shell: process.platform === "win32"
+    });
+
+    child.on("close", async (code) => {
+      if (code === 0) {
+        console.log();
+        console.log(kolor.green("✅ CampsiteJS updated successfully!"));
+        
+        // Read updated version
+        try {
+          const updatedPkgRaw = await readFile(pkgPath, "utf8");
+          const updatedPkg = JSON.parse(updatedPkgRaw);
+          const newVersion = updatedPkg.dependencies?.basecampjs || updatedPkg.devDependencies?.basecampjs;
+          console.log(kolor.dim(`New version: ${newVersion}`));
+        } catch {}
+        
+        console.log();
+        console.log(kolor.dim("🌲 Tip: Run 'campsite dev' to start developing with the latest version\n"));
+        resolve();
+      } else {
+        console.log();
+        console.log(kolor.red(`❌ Update failed with code ${code}\n`));
+        reject(new Error(`npm install failed with code ${code}`));
+      }
+    });
+
+    child.on("error", (err) => {
+      console.log(kolor.red(`❌ Update failed: ${err.message}\n`));
+      reject(err);
+    });
+  });
+}
+
+async function list() {
+  console.log(kolor.cyan(kolor.bold("🗺️  Listing Campsite content...\n")));
+  
+  const config = await loadConfig(cwd);
+  const srcDir = resolve(cwd, config.srcDir || "src");
+  const pagesDir = join(srcDir, "pages");
+  const layoutsDir = join(srcDir, "layouts");
+  const componentsDir = join(srcDir, "components");
+  const partialsDir = join(srcDir, "partials");
+  const collectionsDir = join(srcDir, "collections");
+  const dataDir = join(srcDir, "data");
+
+  // List pages
+  if (existsSync(pagesDir)) {
+    const pages = await walkFiles(pagesDir);
+    if (pages.length > 0) {
+      console.log(kolor.bold("📄 Pages (") + kolor.cyan(pages.length.toString()) + kolor.bold(")"));
+      pages.forEach(page => {
+        const rel = relative(pagesDir, page);
+        console.log("  " + kolor.dim("• ") + rel);
+      });
+      console.log();
+    }
+  }
+
+  // List layouts
+  if (existsSync(layoutsDir)) {
+    const layouts = await readdir(layoutsDir).catch(() => []);
+    if (layouts.length > 0) {
+      console.log(kolor.bold("📝 Layouts (") + kolor.cyan(layouts.length.toString()) + kolor.bold(")"));
+      layouts.forEach(layout => {
+        console.log("  " + kolor.dim("• ") + layout);
+      });
+      console.log();
+    }
+  }
+
+  // List components
+  if (existsSync(componentsDir)) {
+    const components = await readdir(componentsDir).catch(() => []);
+    if (components.length > 0) {
+      console.log(kolor.bold("🧩 Components (") + kolor.cyan(components.length.toString()) + kolor.bold(")"));
+      components.forEach(component => {
+        console.log("  " + kolor.dim("• ") + component);
+      });
+      console.log();
+    }
+  }
+
+  // List partials
+  if (existsSync(partialsDir)) {
+    const partials = await readdir(partialsDir).catch(() => []);
+    if (partials.length > 0) {
+      console.log(kolor.bold("🧰 Partials (") + kolor.cyan(partials.length.toString()) + kolor.bold(")"));
+      partials.forEach(partial => {
+        console.log("  " + kolor.dim("• ") + partial);
+      });
+      console.log();
+    }
+  }
+
+  // List collections
+  if (existsSync(collectionsDir)) {
+    const collections = await readdir(collectionsDir).catch(() => []);
+    const jsonFiles = collections.filter(f => f.endsWith(".json"));
+    if (jsonFiles.length > 0) {
+      console.log(kolor.bold("📁 Collections (") + kolor.cyan(jsonFiles.length.toString()) + kolor.bold(")"));
+      jsonFiles.forEach(collection => {
+        console.log("  " + kolor.dim("• ") + collection);
+      });
+      console.log();
+    }
+  }
+
+  // List data files
+  if (existsSync(dataDir)) {
+    const dataFiles = await readdir(dataDir).catch(() => []);
+    const jsonFiles = dataFiles.filter(f => f.endsWith(".json"));
+    if (jsonFiles.length > 0) {
+      console.log(kolor.bold("📊 Data (") + kolor.cyan(jsonFiles.length.toString()) + kolor.bold(")"));
+      jsonFiles.forEach(dataFile => {
+        console.log("  " + kolor.dim("• ") + dataFile);
+      });
+      console.log();
+    }
+  }
+
+  console.log(kolor.dim("🌲 Tip: Use 'campsite make:<type> <name>' to create new content\n"));
+}
+
+async function preview() {
+  console.log(kolor.cyan(kolor.bold("🏔️  Building for production preview...\n")));
+  await build();
+  console.log();
+  const config = await loadConfig(cwd);
+  const outDir = resolve(cwd, config.outDir || "dist");
+  console.log(kolor.cyan(kolor.bold("🔥 Starting preview server...\n")));
+  serve(outDir);
+}
+
 async function main() {
   const command = argv[2] || "help";
 
+  // Handle flags
+  if (command === "-h" || command === "--help" || command === "help") {
+    showHelp();
+    exit(0);
+  }
+
+  if (command === "-v" || command === "--version") {
+    const version = await getVersion();
+    console.log(`v${version}`);
+    exit(0);
+  }
+
+  // Handle make:type commands
+  if (command.startsWith("make:")) {
+    const type = command.substring(5); // Remove 'make:' prefix
+    if (!type) {
+      console.log(kolor.red("❌ No type specified"));
+      console.log(kolor.dim("Run 'campsite --help' for available make commands.\n"));
+      exit(1);
+    }
+    await makeContent(type);
+    return;
+  }
+
   switch (command) {
+    case "init":
+      await init();
+      break;
     case "dev":
       await dev();
       break;
@@ -545,9 +1295,25 @@ async function main() {
       serve(outDir);
       break;
     }
+    case "preview":
+      await preview();
+      break;
+    case "clean":
+      await clean();
+      break;
+    case "check":
+      await check();
+      break;
+    case "list":
+      await list();
+      break;
+    case "upgrade":
+      await upgrade();
+      break;
     default:
-      console.log("campsite commands: dev | build | serve");
-      exit(0);
+      console.log(kolor.yellow(`Unknown command: ${command}`));
+      console.log(kolor.dim("Run 'campsite --help' for usage information."));
+      exit(1);
   }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "basecampjs",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "type": "module",
   "description": "BasecampJS engine for CampsiteJS static site generator.",
   "bin": {