create-jen-app 1.0.0 → 1.2.1

package/templates/static/lib/build/asset-hashing.js

@@ -0,0 +1,42 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import { createHash } from 'node:crypto';
+import { readFileSync, renameSync } from 'node:fs';
+import { join, dirname, basename, extname } from 'node:path';
+export class AssetHasher {
+    /**
+     * Calculate hash of file content
+     */
+    static hashContent(content) {
+        return createHash('md5').update(content).digest('hex').slice(0, 10);
+    }
+    /**
+     * Rename file to include hash (e.g. style.css -> style.a1b2c3.css)
+     */
+    static hashFile(filePath) {
+        const content = readFileSync(filePath);
+        const hash = this.hashContent(content);
+        const dir = dirname(filePath);
+        const ext = extname(filePath);
+        const name = basename(filePath, ext);
+        const newName = `${name}.${hash}${ext}`;
+        const newPath = join(dir, newName);
+        renameSync(filePath, newPath);
+        return newName;
+    }
+}

package/templates/static/lib/build/asset-manifest.d.ts

@@ -0,0 +1,11 @@
+export interface Manifest {
+    [key: string]: string;
+}
+export declare class AssetManifest {
+    private manifest;
+    private manifestPath;
+    constructor(distDir: string);
+    set(original: string, hashed: string): void;
+    get(original: string): string | undefined;
+    save(): void;
+}

package/templates/static/lib/build/asset-manifest.js

@@ -0,0 +1,38 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import { writeFileSync, readFileSync, existsSync } from 'node:fs';
+import { join } from 'node:path';
+export class AssetManifest {
+    manifest = {};
+    manifestPath;
+    constructor(distDir) {
+        this.manifestPath = join(distDir, 'manifest.json');
+        if (existsSync(this.manifestPath)) {
+            this.manifest = JSON.parse(readFileSync(this.manifestPath, 'utf8'));
+        }
+    }
+    set(original, hashed) {
+        this.manifest[original] = hashed;
+    }
+    get(original) {
+        return this.manifest[original];
+    }
+    save() {
+        writeFileSync(this.manifestPath, JSON.stringify(this.manifest, null, 2));
+    }
+}

package/templates/static/lib/build/build.d.ts

@@ -0,0 +1,4 @@
+import type { FrameworkConfig } from "../core/config.js";
+export declare function buildSite(opts: {
+    config: FrameworkConfig;
+}): Promise<void>;

package/templates/static/lib/build/build.js

@@ -0,0 +1,113 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import { mkdirSync, rmSync, writeFileSync, existsSync, copyFileSync, readdirSync, statSync } from "node:fs";
+import { join } from "node:path";
+import esbuild from "esbuild";
+import { createScssCompiler } from "../css/compiler.js";
+import { vueEsbuildPlugin, svelteEsbuildPlugin } from "../compilers/esbuild-plugins.js";
+import { scanRoutes } from "../core/routes/scan.js";
+import { resolveDistPath } from "../core/paths.js";
+import { log } from "../shared/log.js";
+import { renderRouteToHtml } from "../runtime/render.js";
+function copyDir(src, dst) {
+    if (!existsSync(src))
+        return;
+    mkdirSync(dst, { recursive: true });
+    for (const name of readdirSync(src)) {
+        const sp = join(src, name);
+        const dp = join(dst, name);
+        const st = statSync(sp);
+        if (st.isDirectory())
+            copyDir(sp, dp);
+        else
+            copyFileSync(sp, dp);
+    }
+}
+export async function buildSite(opts) {
+    const { config } = opts;
+    const dist = resolveDistPath(config);
+    rmSync(dist, { recursive: true, force: true });
+    mkdirSync(dist, { recursive: true });
+    const routes = scanRoutes(config);
+    log.info(`Building SSG: ${routes.length} routes`);
+    for (const r of routes) {
+        const url = new URL("http://localhost" + r.urlPath);
+        const html = await renderRouteToHtml({
+            config,
+            route: r,
+            req: {},
+            res: {},
+            url,
+            params: {},
+            query: {},
+            headers: {},
+            cookies: {}
+        });
+        const outPath = r.urlPath === "/"
+            ? join(dist, "index.html")
+            : join(dist, r.urlPath.slice(1), "index.html");
+        mkdirSync(join(outPath, ".."), { recursive: true });
+        writeFileSync(outPath, html, "utf8");
+        log.info(`SSG: ${r.urlPath} -> ${outPath}`);
+    }
+    copyDir(join(process.cwd(), config.siteDir, "assets"), join(dist, "assets"));
+    // Handle Vue/Svelte components in site folder
+    const siteSourceDir = join(process.cwd(), config.siteDir);
+    const vueFiles = readdirSync(siteSourceDir, { recursive: true }).filter((f) => String(f).endsWith(".vue") || String(f).endsWith(".svelte"));
+    if (vueFiles.length > 0) {
+        log.info(`Found ${vueFiles.length} Vue/Svelte components, bundling...`);
+        try {
+            await esbuild.build({
+                entryPoints: vueFiles.map((f) => join(siteSourceDir, String(f))),
+                outdir: join(dist, "components"),
+                format: "esm",
+                target: "es2022",
+                bundle: false,
+                plugins: [vueEsbuildPlugin(), svelteEsbuildPlugin()],
+                external: ["preact", "vue", "svelte"],
+                logLevel: "info",
+            });
+            log.info("Vue/Svelte components bundled successfully.");
+        }
+        catch (err) {
+            log.warn(`Failed to bundle Vue/Svelte components: ${err.message}`);
+        }
+    }
+    // styles.css
+    const scssPath = join(process.cwd(), config.css.globalScss);
+    if (existsSync(scssPath)) {
+        const compiler = createScssCompiler();
+        const result = compiler.compile({
+            inputPath: scssPath,
+            minified: true
+        });
+        if (result.error) {
+            log.error(`SCSS Compilation Failed: ${result.error}`);
+            writeFileSync(join(dist, "styles.css"), "/* SCSS Compilation Failed */");
+        }
+        else {
+            writeFileSync(join(dist, "styles.css"), result.css);
+            log.info(`Compiled global SCSS: ${config.css.globalScss}`);
+        }
+    }
+    else {
+        log.warn(`Global SCSS file not found: ${scssPath}`);
+        writeFileSync(join(dist, "styles.css"), "/* No global SCSS found */");
+    }
+    log.info("Build complete.");
+}

package/templates/static/lib/build/island-hydration.d.ts

@@ -0,0 +1,25 @@
+export interface Island {
+    id: string;
+    component: string;
+    props: any;
+}
+export interface IslandRegistry {
+    islands: Island[];
+}
+/**
+ * Creates an empty island registry for a request
+ */
+export declare function createIslandRegistry(): IslandRegistry;
+/**
+ * Mark a component as an island (placeholder implementation)
+ * In a real framework, this would be a decorator or a HOC
+ */
+export declare function markIsland(name: string, props: any): string;
+/**
+ * Extract islands from HTML string
+ */
+export declare function extractIslandsFromHtml(html: string): Island[];
+/**
+ * Inject hydration script into HTML
+ */
+export declare function injectIslandScript(html: string, islands: Island[]): string;

package/templates/static/lib/build/island-hydration.js

@@ -0,0 +1,62 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+/**
+ * Creates an empty island registry for a request
+ */
+export function createIslandRegistry() {
+    return { islands: [] };
+}
+/**
+ * Mark a component as an island (placeholder implementation)
+ * In a real framework, this would be a decorator or a HOC
+ */
+export function markIsland(name, props) {
+    const id = `island-${Math.random().toString(36).slice(2, 9)}`;
+    return `<div data-island="${name}" data-props='${JSON.stringify(props)}' id="${id}"></div>`;
+}
+/**
+ * Extract islands from HTML string
+ */
+export function extractIslandsFromHtml(html) {
+    const islands = [];
+    const regex = /data-island="([^"]+)" data-props='([^']+)' id="([^"]+)"/g;
+    let match;
+    while ((match = regex.exec(html)) !== null) {
+        islands.push({
+            component: match[1],
+            props: JSON.parse(match[2]),
+            id: match[3]
+        });
+    }
+    return islands;
+}
+/**
+ * Inject hydration script into HTML
+ */
+export function injectIslandScript(html, islands) {
+    if (islands.length === 0)
+        return html;
+    const script = `
+    <script type="module">
+      import { hydrate } from '/__runtime/hydrate.js';
+      const islands = ${JSON.stringify(islands)};
+      islands.forEach(i => hydrate(i.component, i.id, i.props));
+    </script>
+  `;
+    return html.replace('</body>', `${script}</body>`);
+}

package/templates/static/lib/build/minifier.d.ts

@@ -0,0 +1,20 @@
+export interface MinifyOptions {
+    minifyIdentifiers?: boolean;
+    minifySyntax?: boolean;
+    minifyWhitespace?: boolean;
+    target?: string | string[];
+}
+export declare class Minifier {
+    /**
+     * Minify JavaScript/TypeScript using esbuild
+     */
+    static minifyJs(code: string, options?: MinifyOptions): Promise<string>;
+    /**
+     * Minify CSS using esbuild
+     */
+    static minifyCss(code: string): Promise<string>;
+    /**
+     * Minify HTML (basic regex/string-based, as esbuild doesn't handle HTML)
+     */
+    static minifyHtml(html: string): string;
+}

package/templates/static/lib/build/minifier.js

@@ -0,0 +1,65 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import * as esbuild from 'esbuild';
+import { log } from '../shared/log.js';
+export class Minifier {
+    /**
+     * Minify JavaScript/TypeScript using esbuild
+     */
+    static async minifyJs(code, options = {}) {
+        try {
+            const result = await esbuild.transform(code, {
+                loader: 'js',
+                minify: true,
+                legalComments: 'none',
+                ...options
+            });
+            return result.code;
+        }
+        catch (err) {
+            log.error('Minification failed (JS)');
+            throw err;
+        }
+    }
+    /**
+     * Minify CSS using esbuild
+     */
+    static async minifyCss(code) {
+        try {
+            const result = await esbuild.transform(code, {
+                loader: 'css',
+                minify: true
+            });
+            return result.code;
+        }
+        catch (err) {
+            log.error('Minification failed (CSS)');
+            throw err;
+        }
+    }
+    /**
+     * Minify HTML (basic regex/string-based, as esbuild doesn't handle HTML)
+     */
+    static minifyHtml(html) {
+        return html
+            .replace(/<!--[\s\S]*?-->/g, '') // Remove comments
+            .replace(/>\s+</g, '><') // Remove whitespace between tags
+            .replace(/\s{2,}/g, ' ') // Collapse multiple whitespaces
+            .trim();
+    }
+}

package/templates/static/lib/build/page-renderer.d.ts

@@ -0,0 +1,17 @@
+import { FrameworkConfig } from '../core/config.js';
+import { RouteEntry } from '../core/routes/scan.js';
+export interface PageRenderContext {
+    config: FrameworkConfig;
+    route: RouteEntry;
+    url: URL;
+    params: Record<string, string>;
+    query: Record<string, string>;
+    headers: Record<string, string>;
+    cookies: Record<string, string>;
+}
+export declare class PageRenderer {
+    /**
+     * Render a route to a full HTML string, including minification if requested
+     */
+    static render(ctx: PageRenderContext, minify?: boolean): Promise<string>;
+}

package/templates/static/lib/build/page-renderer.js

@@ -0,0 +1,45 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import { renderRouteToHtml } from '../runtime/render.js';
+import { Minifier } from './minifier.js';
+export class PageRenderer {
+    /**
+     * Render a route to a full HTML string, including minification if requested
+     */
+    static async render(ctx, minify = false) {
+        // 1. Core Preact render
+        let html = await renderRouteToHtml({
+            config: ctx.config,
+            route: ctx.route,
+            req: {},
+            res: {},
+            url: ctx.url,
+            params: ctx.params,
+            query: ctx.query,
+            headers: ctx.headers,
+            cookies: ctx.cookies
+        });
+        // 2. Post-processing (Layout injection, hydration script injection)
+        // Note: Hydration logic is handled by island-hydration.ts usually
+        // 3. Optional Minification
+        if (minify) {
+            html = Minifier.minifyHtml(html);
+        }
+        return html;
+    }
+}

package/templates/static/lib/build/production-build.d.ts

@@ -0,0 +1,10 @@
+import { FrameworkConfig } from '../core/config.js';
+export interface ProductionBuildConfig {
+    config: FrameworkConfig;
+}
+export declare class ProductionBuilder {
+    /**
+     * Run the production build sequence
+     */
+    static build(opts: ProductionBuildConfig): Promise<void>;
+}

package/templates/static/lib/build/production-build.js

@@ -0,0 +1,30 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import { SSGPipeline } from './ssg-pipeline.js';
+import { log } from '../shared/log.js';
+export class ProductionBuilder {
+    /**
+     * Run the production build sequence
+     */
+    static async build(opts) {
+        log.info('--- PRODUCTION BUILD START ---');
+        const pipeline = new SSGPipeline(opts.config);
+        await pipeline.run();
+        log.info('--- PRODUCTION BUILD COMPLETE ---');
+    }
+}

package/templates/static/lib/build/ssg-pipeline.d.ts

@@ -0,0 +1,15 @@
+import { FrameworkConfig } from '../core/config.js';
+export declare class SSGPipeline {
+    private config;
+    private dist;
+    constructor(config: FrameworkConfig);
+    /**
+     * Run the full SSG Pipeline
+     */
+    run(): Promise<void>;
+    private prepareDist;
+    private processAssets;
+    private compileStyles;
+    private renderPages;
+    private copyRecursive;
+}

package/templates/static/lib/build/ssg-pipeline.js

@@ -0,0 +1,119 @@
+/*
+ * This file is part of Jen.js.
+ * Copyright (C) 2026 oopsio
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+import { mkdirSync, rmSync, writeFileSync, existsSync, copyFileSync, readdirSync, statSync } from 'node:fs';
+import { join } from 'node:path';
+import { scanRoutes } from '../core/routes/scan.js';
+import { resolveDistPath } from '../core/paths.js';
+import { log } from '../shared/log.js';
+import { PageRenderer } from './page-renderer.js';
+import { AssetHasher } from './asset-hashing.js';
+import { createScssCompiler } from '../css/compiler.js';
+export class SSGPipeline {
+    config;
+    dist;
+    constructor(config) {
+        this.config = config;
+        this.dist = resolveDistPath(config);
+    }
+    /**
+     * Run the full SSG Pipeline
+     */
+    async run() {
+        log.info('Starting SSG Pipeline (Enterprise Build)');
+        // 1. Prepare dist
+        this.prepareDist();
+        // 2. Process Assets
+        await this.processAssets();
+        // 3. Compile Styles
+        const cssPath = await this.compileStyles();
+        // 4. Render Pages
+        await this.renderPages();
+        log.info('Pipeline complete.');
+    }
+    prepareDist() {
+        rmSync(this.dist, { recursive: true, force: true });
+        mkdirSync(this.dist, { recursive: true });
+    }
+    async processAssets() {
+        const assetDir = join(process.cwd(), this.config.siteDir, 'assets');
+        const targetDir = join(this.dist, 'assets');
+        if (existsSync(assetDir)) {
+            this.copyRecursive(assetDir, targetDir);
+            log.info('Assets copied to dist');
+        }
+    }
+    async compileStyles() {
+        const scssPath = join(process.cwd(), this.config.css.globalScss);
+        if (!existsSync(scssPath))
+            return null;
+        const compiler = createScssCompiler();
+        const result = compiler.compile({
+            inputPath: scssPath,
+            minified: true
+        });
+        if (result.error) {
+            log.error(`SCSS Failed: ${result.error}`);
+            return null;
+        }
+        const cssFile = join(this.dist, 'styles.css');
+        writeFileSync(cssFile, result.css);
+        // Hash the CSS
+        const hashedName = AssetHasher.hashFile(cssFile);
+        log.info(`Styles compiled and hashed: ${hashedName}`);
+        return hashedName;
+    }
+    async renderPages() {
+        const routes = scanRoutes(this.config);
+        for (const r of routes) {
+            try {
+                const url = new URL('http://localhost' + r.urlPath);
+                const html = await PageRenderer.render({
+                    config: this.config,
+                    route: r,
+                    url,
+                    params: {},
+                    query: {},
+                    headers: {},
+                    cookies: {}
+                }, true);
+                const outDir = join(this.dist, r.urlPath === '/' ? '' : r.urlPath.slice(1));
+                mkdirSync(outDir, { recursive: true });
+                writeFileSync(join(outDir, 'index.html'), html);
+                log.info(`Rendered ${r.urlPath}`);
+            }
+            catch (err) {
+                const errorMsg = err instanceof Error ? err.message : String(err);
+                log.error(`Failed to render ${r.urlPath}: ${errorMsg}`);
+                throw err;
+            }
+        }
+    }
+    copyRecursive(src, dst) {
+        mkdirSync(dst, { recursive: true });
+        for (const name of readdirSync(src)) {
+            const sp = join(src, name);
+            const dp = join(dst, name);
+            if (statSync(sp).isDirectory()) {
+                this.copyRecursive(sp, dp);
+            }
+            else {
+                copyFileSync(sp, dp);
+            }
+        }
+    }
+}

package/templates/static/lib/build-tools/build-site.d.ts

@@ -0,0 +1,6 @@
+export interface BuildOptions {
+    minify?: boolean;
+    sourcemap?: boolean;
+    optimize?: boolean;
+}
+export declare function buildSite(opts?: BuildOptions): Promise<void>;