@jxsuite/create 0.19.0

package/generate.js

@@ -0,0 +1,139 @@
+/**
+ * Shared project generation logic. Used by both the CLI scaffolder and the Studio server endpoint.
+ */
+
+import { mkdir, writeFile, cp } from "node:fs/promises";
+import { join, dirname } from "node:path";
+import { fileURLToPath } from "node:url";
+import { existsSync } from "node:fs";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const TEMPLATE_DIR = join(__dirname, "template");
+
+/**
+ * @typedef {{
+ *   name: string;
+ *   description?: string;
+ *   url?: string;
+ *   adapter?: "static" | "cloudflare-pages" | "node" | "bun";
+ * }} ProjectOptions
+ */
+
+/**
+ * Generate a new Jx project at the given path.
+ *
+ * @param {string} destPath — absolute path to the project directory
+ * @param {ProjectOptions} opts
+ */
+export async function generateProject(destPath, opts) {
+  const { name, description = "", url = "", adapter = "static" } = opts;
+
+  if (existsSync(destPath)) {
+    const { readdirSync } = await import("node:fs");
+    if (readdirSync(destPath).length > 0) {
+      throw new Error(`Directory "${destPath}" is not empty`);
+    }
+  }
+
+  await mkdir(destPath, { recursive: true });
+  await mkdir(join(destPath, "components"), { recursive: true });
+  await mkdir(join(destPath, "public"), { recursive: true });
+  await mkdir(join(destPath, "content"), { recursive: true });
+
+  const projectJson = buildProjectJson({ name, description, url, adapter });
+  const packageJson = buildPackageJson({ name, description, adapter });
+
+  await Promise.all([
+    writeFile(join(destPath, "project.json"), JSON.stringify(projectJson, null, "\t") + "\n"),
+    writeFile(join(destPath, "package.json"), JSON.stringify(packageJson, null, "  ") + "\n"),
+    cp(join(TEMPLATE_DIR, "gitignore"), join(destPath, ".gitignore")),
+    cp(join(TEMPLATE_DIR, "layouts"), join(destPath, "layouts"), { recursive: true }),
+    cp(join(TEMPLATE_DIR, "pages"), join(destPath, "pages"), { recursive: true }),
+  ]);
+}
+
+/**
+ * @param {ProjectOptions} opts
+ */
+function buildProjectJson({ name, description, url, adapter }) {
+  const $head = [
+    {
+      tagName: "meta",
+      attributes: { name: "viewport", content: "width=device-width, initial-scale=1" },
+    },
+  ];
+
+  if (description) {
+    $head.push({
+      tagName: "meta",
+      attributes: { name: "description", content: description },
+    });
+  }
+
+  /** @type {{ outDir: string; format: string; trailingSlash: string; adapter?: string }} */
+  const build = {
+    outDir: "./dist",
+    format: "directory",
+    trailingSlash: "always",
+  };
+
+  if (adapter && adapter !== "static") {
+    build.adapter = adapter;
+  }
+
+  return {
+    name,
+    url: url || "https://example.com",
+    defaults: {
+      layout: "./layouts/base.json",
+      lang: "en",
+    },
+    $head,
+    $media: {
+      "--": "1280px",
+      "--lg": "(max-width: 1024px)",
+      "--md": "(max-width: 768px)",
+      "--sm": "(max-width: 640px)",
+    },
+    style: {
+      margin: "0",
+      padding: "0",
+      fontFamily: "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
+      lineHeight: "1.6",
+      color: "#1a1a1a",
+    },
+    build,
+  };
+}
+
+/**
+ * @param {{ name: string; description?: string; adapter?: string }} opts
+ */
+function buildPackageJson({ name, description, adapter }) {
+  const slug = name
+    .toLowerCase()
+    .replace(/[^a-z0-9]+/g, "-")
+    .replace(/^-|-$/g, "");
+
+  /** @type {Record<string, string>} */
+  const devDependencies = {
+    "@jxsuite/compiler": "^0.19.0",
+    "@jxsuite/runtime": "^0.19.0",
+  };
+
+  if (adapter === "cloudflare-pages") {
+    devDependencies["wrangler"] = "^4";
+  }
+
+  return {
+    name: slug,
+    private: true,
+    description: description || "",
+    license: "MIT",
+    scripts: {
+      build: "jx build",
+      dev: "jx dev",
+    },
+    devDependencies,
+  };
+}

package/index.js

@@ -0,0 +1,50 @@
+#!/usr/bin/env node
+/**
+ * Scaffold a new Jx project.
+ *
+ * Usage: bun create @jxsuite my-site
+ */
+
+import { createInterface } from "node:readline/promises";
+import { stdin, stdout } from "node:process";
+import { resolve, basename } from "node:path";
+import { generateProject } from "./generate.js";
+
+const dest = process.argv[2];
+if (!dest) {
+  console.error("Usage: bun create @jxsuite <directory>");
+  process.exit(1);
+}
+
+const destPath = resolve(dest);
+const dirName = basename(destPath);
+
+const rl = createInterface({ input: stdin, output: stdout });
+
+const name = (await rl.question(`Project name (${dirName}): `)) || dirName;
+const description = await rl.question("Description: ");
+const url = await rl.question("Production URL (https://example.com): ");
+
+console.log(`
+Deployment adapter:
+  1) static (default)
+  2) cloudflare-pages
+  3) node
+  4) bun
+`);
+const adapterChoice = await rl.question("Adapter [1]: ");
+rl.close();
+
+const adapterMap = { "1": "static", "2": "cloudflare-pages", "3": "node", "4": "bun" };
+const adapter = adapterMap[adapterChoice] || "static";
+
+await generateProject(destPath, { name, description, url, adapter });
+
+console.log(`
+Project created at ${destPath}
+
+Next steps:
+  cd ${dest}
+  bun install
+  bun run dev
+`);

package/package.json

@@ -0,0 +1,24 @@
+{
+  "bin": {
+    "create-jxsuite": "./index.js"
+  },
+  "description": "Scaffold a new Jx project",
+  "exports": {
+    ".": "./index.js",
+    "./generate": "./generate.js"
+  },
+  "files": [
+    "index.js",
+    "generate.js",
+    "template/"
+  ],
+  "license": "MIT",
+  "name": "@jxsuite/create",
+  "repository": {
+    "directory": "packages/create",
+    "type": "git",
+    "url": "git+https://github.com/jxsuite/jx.git"
+  },
+  "type": "module",
+  "version": "0.19.0"
+}

package/template/gitignore

@@ -0,0 +1,3 @@
+.jx-cache
+dist
+node_modules

package/template/layouts/base.json

@@ -0,0 +1,65 @@
+{
+  "tagName": "div",
+  "style": {
+    "margin": "0",
+    "padding": "0",
+    "minHeight": "100vh",
+    "display": "flex",
+    "flexDirection": "column",
+    "fontFamily": "system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
+    "lineHeight": "1.6",
+    "color": "#1a1a1a"
+  },
+  "children": [
+    {
+      "tagName": "header",
+      "style": {
+        "padding": "1rem 2rem",
+        "borderBottom": "1px solid #e5e5e5"
+      },
+      "children": [
+        {
+          "tagName": "a",
+          "attributes": { "href": "/" },
+          "style": {
+            "textDecoration": "none",
+            "fontSize": "1.25rem",
+            "fontWeight": "700",
+            "color": "#1a1a1a"
+          },
+          "children": ["My Site"]
+        }
+      ]
+    },
+    {
+      "tagName": "main",
+      "style": {
+        "flex": "1",
+        "maxWidth": "800px",
+        "margin": "0 auto",
+        "padding": "2rem",
+        "width": "100%"
+      },
+      "children": [
+        { "tagName": "slot" }
+      ]
+    },
+    {
+      "tagName": "footer",
+      "style": {
+        "padding": "1.5rem 2rem",
+        "borderTop": "1px solid #e5e5e5",
+        "textAlign": "center",
+        "fontSize": "0.875rem",
+        "color": "#666"
+      },
+      "children": [
+        {
+          "tagName": "p",
+          "style": { "margin": "0" },
+          "children": ["Built with Jx"]
+        }
+      ]
+    }
+  ]
+}

package/template/pages/index.md

@@ -0,0 +1,7 @@
+---
+title: Home
+---
+
+# Welcome
+
+Your new Jx site is ready. Edit this page at `pages/index.md`.