xanix 1.0.9 → 1.0.11

package/dist/bin/bundler/plugins/XanixServerTransform.d.ts

@@ -0,0 +1,5 @@
+import type { Plugin } from "rollup";
+export interface XanixServerTransformOptions {
+    mode: "watch" | "start";
+}
+export default function XanixServerTransform(options: XanixServerTransformOptions): Plugin;

package/dist/bin/bundler/plugins/XanixServerTransform.js

@@ -0,0 +1,130 @@
+import { parse } from "@babel/parser";
+import traverse from "@babel/traverse";
+import generate from "@babel/generator";
+import * as t from "@babel/types";
+const RUNTIME_IMPORT = "xanix/runtime";
+function findExpressServer(ast) {
+    let appName = null;
+    traverse(ast, {
+        CallExpression(path) {
+            const node = path.node;
+            // Find:
+            // app.listen(...)
+            if (!t.isMemberExpression(node.callee) ||
+                !t.isIdentifier(node.callee.property, {
+                    name: "listen",
+                }) ||
+                !t.isIdentifier(node.callee.object)) {
+                return;
+            }
+            const variableName = node.callee.object.name;
+            // Find the binding of `app`
+            const binding = path.scope.getBinding(variableName);
+            if (!binding || !binding.path.isVariableDeclarator()) {
+                return;
+            }
+            const init = binding.path.node.init;
+            // Confirm:
+            // const app = express();
+            if (t.isCallExpression(init) &&
+                t.isIdentifier(init.callee, {
+                    name: "express",
+                })) {
+                appName = variableName;
+                path.stop();
+            }
+        },
+    });
+    return appName;
+}
+function injectRuntimeImport(ast) {
+    let runtimeImport = null;
+    for (const statement of ast.program.body) {
+        if (t.isImportDeclaration(statement) &&
+            statement.source.value === RUNTIME_IMPORT) {
+            runtimeImport = statement;
+            break;
+        }
+    }
+    if (runtimeImport) {
+        const exists = runtimeImport.specifiers.some((specifier) => t.isImportSpecifier(specifier) &&
+            t.isIdentifier(specifier.imported, {
+                name: "createXanixServer",
+            }));
+        if (!exists) {
+            runtimeImport.specifiers.push(t.importSpecifier(t.identifier("createXanixServer"), t.identifier("createXanixServer")));
+        }
+        return;
+    }
+    ast.program.body.unshift(t.importDeclaration([
+        t.importSpecifier(t.identifier("createXanixServer"), t.identifier("createXanixServer")),
+    ], t.stringLiteral(RUNTIME_IMPORT)));
+}
+export default function XanixServerTransform(options) {
+    return {
+        name: "xanix-server-transform",
+        transform(code, id) {
+            // Ignore node_modules
+            if (id.includes("node_modules")) {
+                return null;
+            }
+            // Only process JS/TS files
+            if (!/\.[cm]?[jt]sx?$/.test(id)) {
+                return null;
+            }
+            let ast;
+            try {
+                ast = parse(code, {
+                    sourceType: "module",
+                    plugins: ["typescript", "jsx"],
+                });
+            }
+            catch {
+                return null;
+            }
+            // Find the REAL server app
+            const appName = findExpressServer(ast);
+            if (!appName) {
+                return null;
+            }
+            let changed = false;
+            traverse(ast, {
+                VariableDeclarator(path) {
+                    const node = path.node;
+                    // Only transform:
+                    // const app = express()
+                    if (!t.isIdentifier(node.id, {
+                        name: appName,
+                    })) {
+                        return;
+                    }
+                    if (!t.isCallExpression(node.init) ||
+                        !t.isIdentifier(node.init.callee, {
+                            name: "express",
+                        })) {
+                        return;
+                    }
+                    node.init = t.callExpression(t.identifier("createXanixServer"), [
+                        t.objectExpression([
+                            t.objectProperty(t.identifier("mode"), t.stringLiteral(options.mode)),
+                        ]),
+                    ]);
+                    changed = true;
+                    path.stop();
+                },
+            });
+            if (!changed) {
+                return null;
+            }
+            injectRuntimeImport(ast);
+            const output = generate(ast, {
+                sourceMaps: true,
+                sourceFileName: id,
+            }, code);
+            return {
+                code: output.code,
+                map: output.map,
+            };
+        },
+    };
+}

package/dist/bin/bundler/plugins/XanixTransform/index.d.ts

@@ -1,5 +1,2 @@
 import type { Plugin } from "rollup";
-export type XanixPluginOptions = {
-    mode: "watch" | "start";
-};
-export declare function XanixTransform(option: XanixPluginOptions): Plugin;
+export declare function XanixTransform(): Plugin;

package/dist/bin/bundler/plugins/XanixTransform/index.js

@@ -1,12 +1,12 @@
 import { transformer } from "./transformer.js";
-export function XanixTransform(option) {
+export function XanixTransform() {
     return {
         name: "xanix-transform",
         async transform(code, id) {
             if (id.includes("node_modules") || !/\.(tsx?|jsx?)$/.test(id)) {
                 return null;
             }
-            const result = transformer(code, id, option.mode);
+            const result = transformer(code, id);
             if (!result) {
                 return null;
             }

package/dist/bin/bundler/plugins/XanixTransform/transformer.d.ts

@@ -13,4 +13,4 @@ export declare function findComponentImport(ast: t.File, componentName: string):
     declaration: t.ImportDeclaration;
     specifier: t.ImportSpecifier | t.ImportDefaultSpecifier;
 } | null;
-export declare function transformer(code: string, id: string, mode: "watch" | "start"): XanixTransformResult | null;
+export declare function transformer(code: string, id: string): XanixTransformResult | null;

package/dist/bin/bundler/plugins/XanixTransform/transformer.js

@@ -309,109 +309,6 @@ function jsxToComponentAndProps(jsx) {
         props,
     };
 }
-/**
- * Find:
- *
- * const app = express();
- * const exp = express();
- * const server = express();
- *
- * Returns the variable name.
- */
-function findExpressAppVariable(ast) {
-    for (const statement of ast.program.body) {
-        if (!t.isVariableDeclaration(statement)) {
-            continue;
-        }
-        for (const declaration of statement.declarations) {
-            if (!t.isIdentifier(declaration.id)) {
-                continue;
-            }
-            if (!t.isCallExpression(declaration.init)) {
-                continue;
-            }
-            if (!t.isIdentifier(declaration.init.callee, {
-                name: "express",
-            })) {
-                continue;
-            }
-            return declaration.id.name;
-        }
-    }
-    return null;
-}
-/**
- * Replace:
- *
- * const app = express();
- *
- * with:
- *
- * const app = createXanixServer({
- *   mode: "watch"
- * });
- */
-function transformExpressAppTocreateXanixServer(ast, args) {
-    const expressVariable = findExpressAppVariable(ast);
-    if (!expressVariable) {
-        return false;
-    }
-    for (const statement of ast.program.body) {
-        if (!t.isVariableDeclaration(statement)) {
-            continue;
-        }
-        for (const declaration of statement.declarations) {
-            if (!t.isIdentifier(declaration.id)) {
-                continue;
-            }
-            if (declaration.id.name !== expressVariable) {
-                continue;
-            }
-            if (!t.isCallExpression(declaration.init)) {
-                continue;
-            }
-            if (!t.isIdentifier(declaration.init.callee, {
-                name: "express",
-            })) {
-                continue;
-            }
-            declaration.init = t.callExpression(t.identifier("createXanixServer"), [
-                t.objectExpression([
-                    t.objectProperty(t.identifier("mode"), t.stringLiteral(args.mode)),
-                ]),
-            ]);
-            return true;
-        }
-    }
-    return false;
-}
-/**
- * Remove:
- *
- * import express from "express";
- *
- * once express() has been replaced by
- * createXanixServer().
- *
- * Also handles:
- *
- * import express, { Router } from "express";
- */
-function removeExpressImport(ast) {
-    for (const statement of ast.program.body) {
-        if (!t.isImportDeclaration(statement)) {
-            continue;
-        }
-        if (statement.source.value !== "express") {
-            continue;
-        }
-        statement.specifiers = statement.specifiers.filter((specifier) => {
-            return !(t.isImportDefaultSpecifier(specifier) &&
-                specifier.local.name === "express");
-        });
-    }
-    removeEmptyImportDeclarations(ast);
-}
 function hasRuntimeImport(ast, name) {
     for (const statement of ast.program.body) {
         if (!t.isImportDeclaration(statement)) {
@@ -449,7 +346,7 @@ function injectRuntimeImport(ast, name) {
     // No runtime import exists yet
     ast.program.body.unshift(t.importDeclaration([t.importSpecifier(t.identifier(name), t.identifier(name))], t.stringLiteral(RUNTIME_IMPORT)));
 }
-export function transformer(code, id, mode) {
+export function transformer(code, id) {
     const ast = parse(code, {
         sourceType: "module",
         plugins: ["typescript", "jsx"],
@@ -586,33 +483,6 @@ export function transformer(code, id, mode) {
     if (!changed) {
         return null;
     }
-    /**
-     * Change:
-     *
-     * const app = express();
-     *
-     * into:
-     *
-     * const app = createXanixServer();
-     */
-    const serverTransformed = transformExpressAppTocreateXanixServer(ast, {
-        mode,
-    });
-    if (serverTransformed) {
-        /**
-         * Remove:
-         *
-         * import express from "express";
-         */
-        removeExpressImport(ast);
-        /**
-         * Add:
-         *
-         * import { createXanixServer }
-         *   from "xanix/runtime";
-         */
-        injectRuntimeImport(ast, "createXanixServer");
-    }
     /**
      * Add:
      *

package/dist/bin/bundler/plugins/plugins.js

@@ -6,10 +6,11 @@ import json from "@rollup/plugin-json";
 import esbuild from "rollup-plugin-esbuild";
 import url from "@rollup/plugin-url";
 import path from "path";
-import { XanixTransform } from "./XanixTransform/index.js";
+import XanixPageTransform from "./XanixPageTransform/index.js";
 import xanixReactRefresh from "./XanixReactRefresh.js";
 import XanixEnvPlugin from "./XanixEnv.js";
 import xanixUseDataId from "./xanixUseDataId.js";
+import XanixServerTransform from "./XanixServerTransform.js";
 export function xanixDefaultPlugins(options = {}) {
     const target = options.target ?? "client";
     const development = options.development ?? true;
@@ -17,8 +18,8 @@ export function xanixDefaultPlugins(options = {}) {
     const isServer = target === "server";
     let _plugins = [];
     if (isServer) {
-        _plugins.push(XanixTransform({ mode: development ? "watch" : "start" }));
-        // _plugins.push(XanixDocument());
+        _plugins.push(XanixPageTransform());
+        _plugins.push(XanixServerTransform({ mode: development ? "watch" : "start" }));
     }
     else {
         if (development) {

package/dist/bin/bundler/watchClient.js

@@ -1,10 +1,11 @@
 import { watch } from "rollup";
-import bundlerOutput, { outDir } from "./config/output.js";
+import bundlerOutput from "./config/output.js";
 import fs from "node:fs";
 import BuildCache from "./cacheNpmModules.js";
 import XanixResolveCacheDeps from "./plugins/XanixResolveCacheDeps/index.js";
 import { getClientRuntimeFile, getClientRuntimeFileName, } from "../include/utils.js";
 import { xanixDefaultPlugins } from "./plugins/plugins.js";
+import outdirs from "../../outdirs.js";
 const WatchClient = async (entries, options) => {
     const input = {};
     for (const entry of entries) {
@@ -12,11 +13,11 @@ const WatchClient = async (entries, options) => {
     }
     const runtimeFileName = getClientRuntimeFileName("development");
     input[runtimeFileName] = getClientRuntimeFile();
-    fs.rmSync(outDir.client, {
+    fs.rmSync(outdirs.client, {
         recursive: true,
         force: true,
     });
-    fs.mkdirSync(outDir.client, {
+    fs.mkdirSync(outdirs.client, {
         recursive: true,
     });
     let buildCache;

package/dist/bin/bundler/watchServer.js

@@ -3,16 +3,17 @@ import path from "node:path";
 import fs from "node:fs";
 import { createManifest, readManifest } from "../include/manifest.js";
 import generateClientEntries from "./generateClientEntries.js";
-import bundlerOutput, { outDir } from "./config/output.js";
+import bundlerOutput from "./config/output.js";
 import { entriesEqual } from "../include/entry.js";
 import { xanixDefaultPlugins } from "./plugins/plugins.js";
+import outdirs from "../../outdirs.js";
 const root = process.cwd();
 const watchServer = async ({ rootEntry, onChange, onBuildEnd, onServerChange, onClientEntryChange, }) => {
-    fs.rmSync(outDir.server, {
+    fs.rmSync(outdirs.server, {
         recursive: true,
         force: true,
     });
-    fs.mkdirSync(outDir.server, {
+    fs.mkdirSync(outdirs.server, {
         recursive: true,
     });
     const entries = await generateClientEntries();
@@ -31,7 +32,6 @@ const watchServer = async ({ rootEntry, onChange, onBuildEnd, onServerChange, on
                 assetExternal: false,
                 onChange: (entry) => {
                     changedFiles.add(entry);
-                    return onChange?.(entry);
                 },
             }),
         ],

package/dist/bin/cli/dev.js

@@ -5,14 +5,14 @@ import watchClient from "../bundler/watchClient.js";
 import pc from "picocolors";
 import logger from "../include/logger.js";
 import { getEntries } from "../include/entry.js";
-import { outDir } from "../bundler/config/output.js";
 import { WebSocketServer } from "ws";
+import outdirs from "../../outdirs.js";
 const root = process.cwd();
 let child;
 function start() {
     child?.kill();
     return new Promise((resolve) => {
-        const filePath = path.join(outDir.server, "index.js");
+        const filePath = path.join(outdirs.server, "index.js");
         child = spawn(process.execPath, [filePath], {
             stdio: !child ? "inherit" : "pipe",
         });

package/dist/bin/cli/start.js

@@ -1,9 +1,9 @@
 import path from "node:path";
 import { spawn } from "child_process";
-import { outDir } from "../bundler/config/output.js";
+import outdirs from "../../outdirs.js";
 let child;
 const start = async () => {
-    const filePath = path.join(outDir.server, "index.js");
+    const filePath = path.join(outdirs.server, "index.js");
     child = spawn(process.execPath, [filePath], {
         stdio: "inherit",
     });

package/dist/bin/include/manifest.js

@@ -1,5 +1,6 @@
 import path from "node:path";
 import fs from "node:fs";
+import outdirs from "../../outdirs.js";
 let readedManifest = null;
 export const createManifest = async (entries) => {
     const manifest = {
@@ -7,7 +8,7 @@ export const createManifest = async (entries) => {
         entries: [...entries.values()],
     };
     readedManifest = manifest;
-    const outDir = path.resolve(process.cwd(), ".xanix");
+    const outDir = path.resolve(process.cwd(), outdirs.root);
     fs.writeFileSync(path.resolve(outDir, "client-manifest.json"), JSON.stringify(manifest, null, 2));
 };
 export const readManifest = async () => readedManifest;

package/dist/client-runtime.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createRoot } from "react-dom/client";
+import outdirs from "./outdirs.js";
 const pages = new Map();
 const ROOT_KEY = "__xanix_root__";
 export const getPath = () => {
     const { pathname, search } = window.location;
     return search ? `${pathname}${search}` : pathname;
 };
-export const getImportUrl = (pageId) => `/.xanix/client/${pageId}.js`;
+export const getImportUrl = (pageId) => `/${outdirs.client}/${pageId}.js`;
 function getRoot() {
     let ele = document.body;
     if (!ele) {

package/dist/components/Head.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect } from "react";
 import useDocument from "../hooks/useDocument.js";
+import outdirs from "../outdirs.js";
 const Head = ({ children }) => {
     const { title, meta, pageId, props, params, pageData } = useDocument();
     if (__XANIX_CLIENT__) {
@@ -39,7 +40,7 @@ const Head = ({ children }) => {
                             request: null,
                         })};
         `,
-                    } }), _jsx("script", { type: "module", src: `/.xanix/client/${__XANIX_CLIENT_RUNTIME_FILE_NAME__}.js` })] }));
+                    } }), _jsx("script", { type: "module", src: `/${outdirs.client}/${__XANIX_CLIENT_RUNTIME_FILE_NAME__}.js` })] }));
     }
 };
 export default Head;

package/dist/dirs.js

@@ -0,0 +1 @@
+"use strict";

package/dist/hooks/useData.js

@@ -2,6 +2,7 @@ import usePage from "./usePage.js";
 import React, { useEffect, useRef } from "react";
 import useDocument from "./useDocument.js";
 import loader from "../dataLoader.js";
+import outdirs from "../outdirs.js";
 const useData = (_callback, _args) => {
     return {};
 };
@@ -31,7 +32,7 @@ useData.register = (xanixId, callback) => {
             const init = useRef(false);
             const reload = async () => {
                 setLoading(true);
-                const res = await fetch(`/.xanix/__data__/${xanixId}`, {
+                const res = await fetch(`/${outdirs.root}/__data__/${xanixId}`, {
                     method: "POST",
                     headers: {
                         "Content-Type": "application/json",

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference path="./types/globals.d.ts" />
 /// <reference path="./types/express.d.ts" />
 /// <reference path="./types/assets.d.ts" />
+/// <reference path="./types/xanix-virtual.d.ts" />
 
 import Link from "./components/Link.js";
 import Document, { DocumentProps } from "./components/Document.js";

package/dist/outdir.d.ts

@@ -0,0 +1,8 @@
+declare const outdir: {
+    root: string;
+    server: string;
+    client: string;
+    cache: string;
+    assets: string;
+};
+export default outdir;

package/dist/outdir.js

@@ -0,0 +1,9 @@
+const ourDirName = ".xanix";
+const outdir = {
+    root: ourDirName,
+    server: ourDirName,
+    client: `${ourDirName}/client`,
+    cache: `${ourDirName}/cache`,
+    assets: `${ourDirName}/assets`,
+};
+export default outdir;

package/dist/outdirs.d.ts

@@ -0,0 +1,8 @@
+declare const outdirs: {
+    root: string;
+    server: string;
+    client: string;
+    cache: string;
+    assets: string;
+};
+export default outdirs;

package/dist/outdirs.js

@@ -0,0 +1,9 @@
+const root = ".xanix";
+const outdirs = {
+    root,
+    server: root,
+    client: `${root}/client`,
+    cache: `${root}/cache`,
+    assets: `${root}/assets`,
+};
+export default outdirs;

package/dist/server/runtime/createServer.js

@@ -1,25 +1,26 @@
 import express from "express";
 import dataLoader from "../../dataLoader.js";
+import outdirs from "../../outdirs.js";
 function createXanixServer({ mode }) {
     const app = express();
     if (mode === "watch") {
-        app.use("/.xanix/client", express.static(".xanix/client"));
-        app.use("/assets", express.static(".xanix/assets"));
-        app.use("/.xanix/cache", express.static(".xanix/cache"));
+        app.use(`/${outdirs.client}`, express.static(`${outdirs.client}`));
+        app.use(`/assets`, express.static(outdirs.assets));
+        app.use(`/${outdirs.cache}`, express.static(`${outdirs.cache}`));
     }
     else {
-        app.use("/.xanix/client", express.static(".xanix/client", {
+        app.use(`/${outdirs.client}`, express.static(`${outdirs.client}`, {
             maxAge: "1y",
             immutable: true,
             etag: true,
         }));
-        app.use("/assets", express.static(".xanix/assets", {
+        app.use(`/assets`, express.static(outdirs.assets, {
             maxAge: "1y",
             immutable: true,
             etag: true,
         }));
     }
-    app.post("/.xanix/__data__/:xanixId", express.json(), async (req, res) => {
+    app.post(`/${outdirs.root}/__data__/:xanixId`, express.json(), async (req, res) => {
         const { xanixId } = req.params;
         const args = req.body;
         const data = await dataLoader.result(xanixId, args);

package/dist/server/runtime/readManifest.js

@@ -1,7 +1,8 @@
 import fs from "node:fs/promises";
 import path from "node:path";
+import outdirs from "../../outdirs";
 async function readManifest() {
-    const manifestPath = path.resolve(process.cwd(), ".xanix", "client-manifest.json");
+    const manifestPath = path.resolve(process.cwd(), outdirs.root, "client-manifest.json");
     const source = await fs.readFile(manifestPath, "utf8");
     return JSON.parse(source);
 }

package/dist/types/globals.d.ts

@@ -19,7 +19,6 @@ declare global {
   const XANIX_PRELOAD: string;
   const XANIX_PRELOAD_START: string;
   const XANIX_PRELOAD_END: string;
-
   const XANIX_NAVIGATE_RELOAD: string;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xanix",
-  "version": "1.0.9",
+  "version": "1.0.11",
   "description": "",
   "main": "dist/index.js",
   "module": "dist/index.js",