xpine 0.0.60 → 0.0.62

package/dist/index.js

@@ -6,8 +6,8 @@ import EventEmitter2 from "events";
 import chokidar from "chokidar";
 
 // src/scripts/build.ts
-import path6 from "path";
-import fs7 from "fs-extra";
+import path7 from "path";
+import fs8 from "fs-extra";
 import { build } from "esbuild";
 import micromatch from "micromatch";
 import minifyXML from "minify-xml";
@@ -305,18 +305,27 @@ async function triggerXPineOnLoad(noCache = false) {
 import { globSync as globSync3 } from "glob";
 
 // src/util/paths.ts
+import path3 from "path";
+import fs2 from "fs";
 function getXPineDistDir() {
-  const dir = import.meta.dirname;
-  const splitDir = dir.split("/xpine/dist");
-  if (splitDir.length === 1) {
-    const splitDirSingle = dir.split("/xpine/");
-    return splitDirSingle[0] + "/xpine/dist";
+  let dir = import.meta.dirname;
+  while (true) {
+    const packageJsonPath = path3.join(dir, "package.json");
+    if (fs2.existsSync(packageJsonPath)) {
+      try {
+        const packageJson2 = JSON.parse(fs2.readFileSync(packageJsonPath, "utf-8"));
+        if (packageJson2?.name === "xpine") return path3.join(dir, "dist");
+      } catch {
+      }
+    }
+    const parent = path3.dirname(dir);
+    if (parent === dir) throw new Error(`Could not find the xpine package root from ${import.meta.dirname}`);
+    dir = parent;
   }
-  return splitDir[0] + "/xpine/dist";
 }
 
 // src/build/esbuild/transformTSXFiles.ts
-import fs2 from "fs-extra";
+import fs3 from "fs-extra";
 import ts2 from "typescript";
 
 // src/util/regex.ts
@@ -343,14 +352,14 @@ var regex_default = {
 };
 
 // src/util/config-file.ts
-import path3 from "path";
+import path4 from "path";
 function sourcePathToDistPath(sourcePath) {
   return sourcePath?.replace(config.srcDir, config.distDir)?.replace(/\.ts$/, ".js")?.replace(/\.tsx$/, ".js");
 }
 function getConfigFiles(pathName, pageConfigFiles, returnDistPaths = true) {
   const configs = [];
   for (const configFile of pageConfigFiles) {
-    const result = path3.relative(pathName, configFile)?.replace(regex_default.configFile, "");
+    const result = path4.relative(pathName, configFile)?.replace(regex_default.configFile, "");
     const hasLetters = result.match(regex_default.hasLetters);
     if (!hasLetters) {
       configs.push(returnDistPaths ? sourcePathToDistPath(configFile) : configFile);
@@ -379,7 +388,7 @@ function transformTSXFiles(componentData, pageConfigFiles) {
     name: "transform-tsx-files",
     setup(build2) {
       build2.onLoad({ filter: regex_default.dotTsx }, async (args) => {
-        const content = fs2.readFileSync(args.path, "utf-8");
+        const content = fs3.readFileSync(args.path, "utf-8");
         const source = ts2.createSourceFile(
           args.path,
           content,
@@ -407,8 +416,8 @@ function transformTSXFiles(componentData, pageConfigFiles) {
 }
 
 // src/build/esbuild/addDotJS.ts
-import fs3 from "fs-extra";
-import path4 from "path";
+import fs4 from "fs-extra";
+import path5 from "path";
 import builtinModules from "builtin-modules";
 function addDotJS(allPackages2, extensions2, isDev2) {
   const allPackagesIncludingNode = allPackages2.concat(builtinModules);
@@ -419,11 +428,11 @@ function addDotJS(allPackages2, extensions2, isDev2) {
         const hasAtSign = args.path.startsWith("@");
         const isPackage = hasAtSign ? allPackagesIncludingNode.includes(args.path) : allPackagesIncludingNode.includes(args.path.split("/").shift());
         if (args.importer && !isPackage) {
-          const calculatedDir = path4.join(args.resolveDir, args.path);
+          const calculatedDir = path5.join(args.resolveDir, args.path);
           let existsAsFile = false;
           for (const extension of extensions2) {
             const asFile = calculatedDir + extension;
-            const exists = fs3.existsSync(asFile);
+            const exists = fs4.existsSync(asFile);
             if (exists) existsAsFile = true;
           }
           let outputPath = args.path + (existsAsFile ? "" : "/index") + ".js";
@@ -436,13 +445,13 @@ function addDotJS(allPackages2, extensions2, isDev2) {
 }
 
 // src/build/esbuild/getDataFiles.ts
-import fs4 from "fs-extra";
+import fs5 from "fs-extra";
 function getDataFiles(dataFiles) {
   return {
     name: "get-data-files",
     setup(build2) {
       build2.onLoad({ filter: /\.data\.(js|mjs|ts)$/ }, (args) => {
-        const contents = fs4.readFileSync(args.path, "utf-8");
+        const contents = fs5.readFileSync(args.path, "utf-8");
         dataFiles.push({
           ...args,
           contents
@@ -460,6 +469,15 @@ function getDataFiles(dataFiles) {
 var doctypeHTML = "<!DOCTYPE html>";
 var staticComment = "<!-- static -->";
 
+// src/util/dev-server-port.ts
+function getDevServerWsPort() {
+  const wsPort = Number.parseInt(process.env.WS_PORT || "", 10);
+  if (Number.isInteger(wsPort) && wsPort > 0) return wsPort;
+  const appPort = Number.parseInt(process.env.PORT || "", 10);
+  if (Number.isInteger(appPort) && appPort > 0) return appPort + 1;
+  return 3001;
+}
+
 // src/scripts/build.ts
 import ts3 from "typescript";
 
@@ -511,8 +529,8 @@ function getTokenFromRequest(req) {
 
 // src/express.ts
 import requestIP from "request-ip";
-import fs5 from "fs-extra";
-import path5 from "path";
+import fs6 from "fs-extra";
+import path6 from "path";
 import EventEmitter from "events";
 
 // src/csrf.ts
@@ -839,10 +857,10 @@ function routeHasStaticPath(route, params) {
     if (key === "0") routeToStaticPath = routeToStaticPath.replace(/\/\*/g, () => `/${value}`);
   }
   routeToStaticPath += "/index.html";
-  const pagesDir = path5.resolve(config.distPagesDir);
-  const outputPath = path5.resolve(pagesDir, "." + path5.posix.normalize("/" + routeToStaticPath));
-  if (outputPath !== pagesDir && !outputPath.startsWith(pagesDir + path5.sep)) return false;
-  if (fs5.existsSync(outputPath)) return outputPath;
+  const pagesDir = path6.resolve(config.distPagesDir);
+  const outputPath = path6.resolve(pagesDir, "." + path6.posix.normalize("/" + routeToStaticPath));
+  if (outputPath !== pagesDir && !outputPath.startsWith(pagesDir + path6.sep)) return false;
+  if (fs6.existsSync(outputPath)) return outputPath;
   return false;
 }
 function filePathToURLPath(pathName, isDist = true) {
@@ -857,7 +875,7 @@ function filePathToURLPath(pathName, isDist = true) {
 
 // src/build/css.ts
 import { globSync as globSync2 } from "glob";
-import fs6 from "fs-extra";
+import fs7 from "fs-extra";
 import postcss from "postcss";
 
 // src/build/postcss/remove-layers.ts
@@ -926,15 +944,15 @@ async function buildCSS(disableTailwind) {
   const cssFiles = globSync2(config.srcDir + "/**/*.css");
   for (const file of cssFiles) {
     try {
-      const fileContents = fs6.readFileSync(file, "utf-8");
+      const fileContents = fs7.readFileSync(file, "utf-8");
       let result = fileContents;
       if (!disableTailwind) {
         result = await postcss([add_breakpoint_data_default()]).process(fileContents, { from: file });
         result = await postcss([tailwindPostcss(), remove_layers_default()]).process(result.css, { from: file });
       }
       const newPath = file.replace(config.srcDir, config.distDir);
-      fs6.ensureFileSync(newPath);
-      fs6.writeFileSync(newPath, result.css);
+      fs7.ensureFileSync(newPath);
+      fs7.writeFileSync(newPath, result.css);
     } catch (err) {
       console.error(err);
     }
@@ -944,7 +962,7 @@ async function buildCSS(disableTailwind) {
 
 // src/scripts/build.ts
 var extensions = [".ts", ".tsx"];
-var packageJson = JSON.parse(fs7.readFileSync(config.packageJsonPath, "utf-8"));
+var packageJson = JSON.parse(fs8.readFileSync(config.packageJsonPath, "utf-8"));
 var allPackages = Object.keys(packageJson.devDependencies).concat(Object.keys(packageJson.dependencies));
 var xpineDistDir = getXPineDistDir();
 async function buildApp(args) {
@@ -952,7 +970,7 @@ async function buildApp(args) {
   const removePreviousBuild = args?.removePreviousBuild || false;
   const disableTailwind = args?.disableTailwind || false;
   try {
-    if (removePreviousBuild) fs7.removeSync(config.distDir);
+    if (removePreviousBuild) fs8.removeSync(config.distDir);
     const srcDirFiles = globSync3(config.srcDir + "/**/*.{js,ts,tsx,jsx}");
     const { componentData, dataFiles } = await buildAppFiles(srcDirFiles, isDev2);
     const clientSideBundles = [];
@@ -977,7 +995,7 @@ async function buildApp(args) {
       const alpineDataFile = await buildAlpineDataFile(componentData, dataFiles);
       await buildClientSideFiles([alpineDataFile, ...clientSideBundles], isDev2);
     }
-    fs7.removeSync(config.distTempFolder);
+    fs8.removeSync(config.distTempFolder);
     await buildCSS(disableTailwind);
     await buildPublicFolderSymlinks();
     await buildOnLoadFile(componentData, isDev2);
@@ -998,7 +1016,7 @@ async function buildAppFiles(files, isDev2) {
     return fileName === "+config";
   });
   const backendFiles = files.filter((file) => extensions?.find((ext) => file.endsWith(ext))).filter((file) => !file.startsWith(config.publicDir));
-  fs7.ensureDirSync(config.distDir);
+  fs8.ensureDirSync(config.distDir);
   await build({
     entryPoints: backendFiles,
     format: "esm",
@@ -1022,8 +1040,8 @@ async function buildAppFiles(files, isDev2) {
   };
 }
 async function buildClientSideFiles(alpineDataFiles = [], isDev2, tempClientSidePath, id) {
-  const tempFilePath = path6.join(config.distTempFolder, tempClientSidePath || "./app.ts");
-  fs7.ensureFileSync(tempFilePath);
+  const tempFilePath = path7.join(config.distTempFolder, tempClientSidePath || "./app.ts");
+  fs8.ensureFileSync(tempFilePath);
   const pagesScriptsGlob = config.publicDir + "/scripts/pages/**/*.{js,ts}";
   const standaloneFolderGlob = config.publicDir + "/standalone/**/*.*";
   const clientFiles = globSync3(
@@ -1056,14 +1074,14 @@ async function buildClientSideFiles(alpineDataFiles = [], isDev2, tempClientSide
   await logSize(config.distPublicDir, id ? `client bundle: ${id}.js` : "client bundle: app.js");
 }
 function writeDevServerClientSideCode(tempFilePath) {
-  const devServerPath = path6.join(xpineDistDir, "./src/static/dev-server.js");
-  const content = fs7.readFileSync(devServerPath, "utf-8");
-  fs7.appendFileSync(tempFilePath, "\n" + content);
+  const devServerPath = path7.join(xpineDistDir, "./src/static/dev-server.js");
+  const content = fs8.readFileSync(devServerPath, "utf-8").replace("__XPINE_WS_PORT__", String(getDevServerWsPort()));
+  fs8.appendFileSync(tempFilePath, "\n" + content);
 }
 function writeSpaClientSideCode(tempFilePath) {
-  const spaPath = path6.join(xpineDistDir, "./src/static/spa.js");
-  const content = fs7.readFileSync(spaPath, "utf-8");
-  fs7.appendFileSync(tempFilePath, "\n" + content);
+  const spaPath = path7.join(xpineDistDir, "./src/static/spa.js");
+  const content = fs8.readFileSync(spaPath, "utf-8");
+  fs8.appendFileSync(tempFilePath, "\n" + content);
 }
 async function buildAlpineDataFile(componentData, dataFiles, bundleID) {
   const output = {
@@ -1110,13 +1128,13 @@ async function buildAlpineDataFile(componentData, dataFiles, bundleID) {
   }
   const result = output.imports.join("\n") + "\n" + output.code.join("\n") + "\n" + output.end.join("\n");
   if (bundleID) {
-    const bundlePath = path6.join(config.distTempFolder, `./alpine-data-${bundleID}.ts`);
-    fs7.ensureFileSync(bundlePath);
-    fs7.writeFileSync(bundlePath, result);
+    const bundlePath = path7.join(config.distTempFolder, `./alpine-data-${bundleID}.ts`);
+    fs8.ensureFileSync(bundlePath);
+    fs8.writeFileSync(bundlePath, result);
     return bundlePath;
   } else {
-    fs7.ensureFileSync(config.alpineDataPath);
-    fs7.writeFileSync(config.alpineDataPath, result);
+    fs8.ensureFileSync(config.alpineDataPath);
+    fs8.writeFileSync(config.alpineDataPath, result);
     return config.alpineDataPath;
   }
 }
@@ -1134,8 +1152,8 @@ async function buildPublicFolderSymlinks() {
       const splitNewPath = newPath.split("/");
       splitNewPath.pop();
       const newDir = splitNewPath.join("/");
-      fs7.ensureDirSync(newDir);
-      fs7.symlinkSync(file, newPath);
+      fs8.ensureDirSync(newDir);
+      fs8.symlinkSync(file, newPath);
     } catch {
     }
   }
@@ -1146,8 +1164,8 @@ async function buildPublicFolderSymlinks() {
       const updatedNewPath = splitNewPath.join("/");
       splitNewPath.pop();
       const newDir = splitNewPath.join("/");
-      fs7.ensureDirSync(newDir);
-      fs7.symlinkSync(file, updatedNewPath);
+      fs8.ensureDirSync(newDir);
+      fs8.symlinkSync(file, updatedNewPath);
     } catch {
     }
   }
@@ -1158,7 +1176,7 @@ async function logSize(pathName, type, validExtensions = [".js", ".css"]) {
     if (!validExtensions?.find((ext) => file.endsWith(ext))) return false;
     return {
       file,
-      size: fs7.statSync(file).size / (1024 * 1e3)
+      size: fs8.statSync(file).size / (1024 * 1e3)
     };
   }).filter(Boolean);
   const totalSize = fileSizes.reduce((total, current) => {
@@ -1216,9 +1234,9 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
         routePath: urlPath
       };
       const staticComponentOutput = await componentFn({ data, routePath: urlPath, req });
-      const htmlOutputPath = path6.join(outputPath, "./index.html");
-      fs7.ensureFileSync(htmlOutputPath);
-      fs7.writeFileSync(
+      const htmlOutputPath = path7.join(outputPath, "./index.html");
+      fs8.ensureFileSync(htmlOutputPath);
+      fs8.writeFileSync(
         htmlOutputPath,
         doctypeHTML + (config2?.wrapper ? await config2.wrapper({ req, children: staticComponentOutput, config: config2, data, routePath: urlPath }) : staticComponentOutput) + staticComment
       );
@@ -1230,7 +1248,7 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
     const dynamicPaths = await config2.staticPaths();
     for (const dynamicPath of dynamicPaths) {
       try {
-        const updatedOutDir = path6.join(outputPath, `./${componentDynamicPaths.map((key) => dynamicPath[key]).join("/")}`);
+        const updatedOutDir = path7.join(outputPath, `./${componentDynamicPaths.map((key) => dynamicPath[key]).join("/")}`);
         const urlPath = filePathToURLPath(updatedOutDir);
         const req = {
           params: {
@@ -1244,9 +1262,9 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
         let data = config2?.data ? await config2.data(req) : null;
         data = { ...data, routePath: urlPath };
         const staticComponentOutput = await componentFn({ req, data, routePath: urlPath });
-        fs7.ensureDirSync(updatedOutDir);
-        fs7.writeFileSync(
-          path6.join(updatedOutDir, "./index.html"),
+        fs8.ensureDirSync(updatedOutDir);
+        fs8.writeFileSync(
+          path7.join(updatedOutDir, "./index.html"),
           doctypeHTML + (config2?.wrapper ? await config2.wrapper({ req, children: staticComponentOutput, config: config2, data, routePath: urlPath }) : staticComponentOutput) + staticComment
         );
       } catch (err) {
@@ -1260,10 +1278,10 @@ function determineOutputPathForStaticPath(builtComponentPath, componentDynamicPa
   if (componentDynamicPaths?.length) {
     return componentDynamicPaths.reduce((total, current) => {
       return total.replace(`/[...${current}]`, "").replace(`/[${current}]`, "");
-    }, path6.dirname(builtComponentPath));
+    }, path7.dirname(builtComponentPath));
   } else {
     if (builtComponentPath?.match(regex_default.endsWithIndex)) {
-      return path6.dirname(builtComponentPath);
+      return path7.dirname(builtComponentPath);
     } else {
       if (!builtComponentPath.match(regex_default.endsWithJs)) return null;
       return builtComponentPath.replace(regex_default.endsWithJs, "");
@@ -1310,8 +1328,8 @@ async function buildOnLoadFile(componentData, isDev2) {
       context.runArrayQueue();
     }
   `;
-  const onLoadFilePath = path6.join(config.distDir, "./__xpineOnLoad.ts");
-  fs7.writeFileSync(onLoadFilePath, output);
+  const onLoadFilePath = path7.join(config.distDir, "./__xpineOnLoad.ts");
+  fs8.writeFileSync(onLoadFilePath, output);
   await build({
     entryPoints: [onLoadFilePath],
     format: "esm",
@@ -1366,20 +1384,20 @@ async function buildSitemap() {
   }).join("\n")}
     </urlset>
   `;
-  fs7.ensureFileSync(config.sitemapPath);
-  fs7.writeFileSync(config.sitemapPath, minifyXML(sitemap));
+  fs8.ensureFileSync(config.sitemapPath);
+  fs8.writeFileSync(config.sitemapPath, minifyXML(sitemap));
 }
 
 // src/runDevServer.ts
-import path8 from "path";
+import path9 from "path";
 
 // src/util/env.ts
 import dotenv from "dotenv";
-import path7 from "path";
+import path8 from "path";
 import { GetSecretValueCommand, SecretsManagerClient } from "@aws-sdk/client-secrets-manager";
 async function setupEnv() {
   if (process.env.HAS_SETUP_ENV) return;
-  dotenv.config({ path: path7.join(config.rootDir, `./.env.${process.env.STAGE || "dev"}`) });
+  dotenv.config({ path: path8.join(config.rootDir, `./.env.${process.env.STAGE || "dev"}`) });
   await loadSecretsManagerSecrets();
   process.env.HAS_SETUP_ENV = "true";
 }
@@ -1416,12 +1434,12 @@ async function runDevServer() {
   const watcher = chokidar.watch(config.srcDir, {
     ignoreInitial: true,
     // Ignore map and prisma files
-    ignored: (pathName) => pathName.endsWith(".map") || pathName.startsWith(path8.join(config.serverDir, "./prisma"))
+    ignored: (pathName) => pathName.endsWith(".map") || pathName.startsWith(path9.join(config.serverDir, "./prisma"))
   });
-  watcher.on("all", async (event, path9) => {
-    const isRegularExpressRoute = path9.startsWith(config.pagesDir) && (path9.endsWith(".ts") || path9.endsWith(".js"));
-    const isServerDir = path9.startsWith(config.serverDir) && !path9.startsWith(config.runDir);
-    const shouldReloadServer = isServerDir || isRegularExpressRoute || ["add", "unlink"].includes(event) && path9.startsWith(config.pagesDir);
+  watcher.on("all", async (event, path10) => {
+    const isRegularExpressRoute = path10.startsWith(config.pagesDir) && (path10.endsWith(".ts") || path10.endsWith(".js"));
+    const isServerDir = path10.startsWith(config.serverDir) && !path10.startsWith(config.runDir);
+    const shouldReloadServer = isServerDir || isRegularExpressRoute || ["add", "unlink"].includes(event) && path10.startsWith(config.pagesDir);
     if (shouldReloadServer) {
       await asyncServerClose(appServer.server);
       rebuildEmitter.emit("rebuild-server");
@@ -1451,11 +1469,18 @@ async function runDevServer() {
       ws.send("refresh:client");
     });
   });
-  const wsPort = 3001;
+  const wsPort = getDevServerWsPort();
   wsServer.listen(wsPort);
   wsServer.on("listening", () => {
     console.info(`Dev server listening on port ${wsPort}`);
   });
+  wsServer.prependListener("error", (err) => {
+    if (err.code === "EADDRINUSE") {
+      console.error(`Live-reload port ${wsPort} is already in use (another dev server?). Set WS_PORT or PORT to use a different port.`);
+      process.exit(1);
+    }
+    throw err;
+  });
 }
 function asyncServerClose(server) {
   return new Promise((resolve) => {

package/dist/src/runDevServer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"runDevServer.d.ts","sourceRoot":"","sources":["../../src/runDevServer.ts"],"names":[],"mappings":"AAYA,wBAAsB,YAAY,kBA+DjC"}
+{"version":3,"file":"runDevServer.d.ts","sourceRoot":"","sources":["../../src/runDevServer.ts"],"names":[],"mappings":"AAaA,wBAAsB,YAAY,kBAuEjC"}

package/dist/src/scripts/build.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"build.d.ts","sourceRoot":"","sources":["../../../src/scripts/build.ts"],"names":[],"mappings":"AAoBA,OAAO,EAAE,UAAU,EAA2B,aAAa,EAAE,MAAM,aAAa,CAAC;AAajF,KAAK,YAAY,GAAG;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAA;AAED,wBAAsB,QAAQ,CAAC,IAAI,EAAE,YAAY,iBAgDhD;AA4JD,wBAAsB,yBAAyB,kBAiC9C;AAED,wBAAsB,OAAO,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,eAAe,WAAkB,iBAa9F;AAED,wBAAsB,qBAAqB,CAAC,aAAa,EAAE,aAAa,EAAE,iBAezE;AAED,wBAAsB,gBAAgB,CAAC,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,EAAE,kBAAkB,EAAE,MAAM,iBA2FpI;AAED,wBAAgB,gCAAgC,CAAC,kBAAkB,EAAE,MAAM,EAAE,qBAAqB,CAAC,EAAE,MAAM,EAAE,UAgB5G;AAED,wBAAgB,wBAAwB,CAAC,aAAa,EAAE,MAAM,GAAG,MAAM,EAAE,CAUxE;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,EAAE,EAAE,MAAM,CAAC;CACZ,CAAA;AAGD,wBAAsB,eAAe,CAAC,aAAa,EAAE,aAAa,EAAE,EAAE,KAAK,CAAC,EAAE,OAAO,iBAoDpF;AAED,wBAAsB,YAAY,kBA4CjC"}
+{"version":3,"file":"build.d.ts","sourceRoot":"","sources":["../../../src/scripts/build.ts"],"names":[],"mappings":"AAqBA,OAAO,EAAE,UAAU,EAA2B,aAAa,EAAE,MAAM,aAAa,CAAC;AAajF,KAAK,YAAY,GAAG;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAA;AAED,wBAAsB,QAAQ,CAAC,IAAI,EAAE,YAAY,iBAgDhD;AA6JD,wBAAsB,yBAAyB,kBAiC9C;AAED,wBAAsB,OAAO,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,eAAe,WAAkB,iBAa9F;AAED,wBAAsB,qBAAqB,CAAC,aAAa,EAAE,aAAa,EAAE,iBAezE;AAED,wBAAsB,gBAAgB,CAAC,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,EAAE,kBAAkB,EAAE,MAAM,iBA2FpI;AAED,wBAAgB,gCAAgC,CAAC,kBAAkB,EAAE,MAAM,EAAE,qBAAqB,CAAC,EAAE,MAAM,EAAE,UAgB5G;AAED,wBAAgB,wBAAwB,CAAC,aAAa,EAAE,MAAM,GAAG,MAAM,EAAE,CAUxE;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,EAAE,EAAE,MAAM,CAAC;CACZ,CAAA;AAGD,wBAAsB,eAAe,CAAC,aAAa,EAAE,aAAa,EAAE,EAAE,KAAK,CAAC,EAAE,OAAO,iBAoDpF;AAED,wBAAsB,YAAY,kBA4CjC"}

package/dist/src/scripts/xpine-build.js

@@ -1,8 +1,8 @@
 #!/usr/bin/env node
 
 // src/scripts/build.ts
-import path5 from "path";
-import fs7 from "fs-extra";
+import path6 from "path";
+import fs8 from "fs-extra";
 import { build } from "esbuild";
 import micromatch from "micromatch";
 import minifyXML from "minify-xml";
@@ -300,18 +300,27 @@ async function triggerXPineOnLoad(noCache = false) {
 import { globSync as globSync3 } from "glob";
 
 // src/util/paths.ts
+import path3 from "path";
+import fs2 from "fs";
 function getXPineDistDir() {
-  const dir = import.meta.dirname;
-  const splitDir = dir.split("/xpine/dist");
-  if (splitDir.length === 1) {
-    const splitDirSingle = dir.split("/xpine/");
-    return splitDirSingle[0] + "/xpine/dist";
+  let dir = import.meta.dirname;
+  while (true) {
+    const packageJsonPath = path3.join(dir, "package.json");
+    if (fs2.existsSync(packageJsonPath)) {
+      try {
+        const packageJson2 = JSON.parse(fs2.readFileSync(packageJsonPath, "utf-8"));
+        if (packageJson2?.name === "xpine") return path3.join(dir, "dist");
+      } catch {
+      }
+    }
+    const parent = path3.dirname(dir);
+    if (parent === dir) throw new Error(`Could not find the xpine package root from ${import.meta.dirname}`);
+    dir = parent;
   }
-  return splitDir[0] + "/xpine/dist";
 }
 
 // src/build/esbuild/transformTSXFiles.ts
-import fs2 from "fs-extra";
+import fs3 from "fs-extra";
 import ts2 from "typescript";
 
 // src/util/regex.ts
@@ -338,14 +347,14 @@ var regex_default = {
 };
 
 // src/util/config-file.ts
-import path3 from "path";
+import path4 from "path";
 function sourcePathToDistPath(sourcePath) {
   return sourcePath?.replace(config.srcDir, config.distDir)?.replace(/\.ts$/, ".js")?.replace(/\.tsx$/, ".js");
 }
 function getConfigFiles(pathName, pageConfigFiles, returnDistPaths = true) {
   const configs = [];
   for (const configFile of pageConfigFiles) {
-    const result = path3.relative(pathName, configFile)?.replace(regex_default.configFile, "");
+    const result = path4.relative(pathName, configFile)?.replace(regex_default.configFile, "");
     const hasLetters = result.match(regex_default.hasLetters);
     if (!hasLetters) {
       configs.push(returnDistPaths ? sourcePathToDistPath(configFile) : configFile);
@@ -374,7 +383,7 @@ function transformTSXFiles(componentData, pageConfigFiles) {
     name: "transform-tsx-files",
     setup(build2) {
       build2.onLoad({ filter: regex_default.dotTsx }, async (args) => {
-        const content = fs2.readFileSync(args.path, "utf-8");
+        const content = fs3.readFileSync(args.path, "utf-8");
         const source = ts2.createSourceFile(
           args.path,
           content,
@@ -402,8 +411,8 @@ function transformTSXFiles(componentData, pageConfigFiles) {
 }
 
 // src/build/esbuild/addDotJS.ts
-import fs3 from "fs-extra";
-import path4 from "path";
+import fs4 from "fs-extra";
+import path5 from "path";
 import builtinModules from "builtin-modules";
 function addDotJS(allPackages2, extensions2, isDev3) {
   const allPackagesIncludingNode = allPackages2.concat(builtinModules);
@@ -414,11 +423,11 @@ function addDotJS(allPackages2, extensions2, isDev3) {
         const hasAtSign = args.path.startsWith("@");
         const isPackage = hasAtSign ? allPackagesIncludingNode.includes(args.path) : allPackagesIncludingNode.includes(args.path.split("/").shift());
         if (args.importer && !isPackage) {
-          const calculatedDir = path4.join(args.resolveDir, args.path);
+          const calculatedDir = path5.join(args.resolveDir, args.path);
           let existsAsFile = false;
           for (const extension of extensions2) {
             const asFile = calculatedDir + extension;
-            const exists = fs3.existsSync(asFile);
+            const exists = fs4.existsSync(asFile);
             if (exists) existsAsFile = true;
           }
           let outputPath = args.path + (existsAsFile ? "" : "/index") + ".js";
@@ -431,13 +440,13 @@ function addDotJS(allPackages2, extensions2, isDev3) {
 }
 
 // src/build/esbuild/getDataFiles.ts
-import fs4 from "fs-extra";
+import fs5 from "fs-extra";
 function getDataFiles(dataFiles) {
   return {
     name: "get-data-files",
     setup(build2) {
       build2.onLoad({ filter: /\.data\.(js|mjs|ts)$/ }, (args) => {
-        const contents = fs4.readFileSync(args.path, "utf-8");
+        const contents = fs5.readFileSync(args.path, "utf-8");
         dataFiles.push({
           ...args,
           contents
@@ -455,6 +464,15 @@ function getDataFiles(dataFiles) {
 var doctypeHTML = "<!DOCTYPE html>";
 var staticComment = "<!-- static -->";
 
+// src/util/dev-server-port.ts
+function getDevServerWsPort() {
+  const wsPort = Number.parseInt(process.env.WS_PORT || "", 10);
+  if (Number.isInteger(wsPort) && wsPort > 0) return wsPort;
+  const appPort = Number.parseInt(process.env.PORT || "", 10);
+  if (Number.isInteger(appPort) && appPort > 0) return appPort + 1;
+  return 3001;
+}
+
 // src/scripts/build.ts
 import ts3 from "typescript";
 
@@ -468,7 +486,7 @@ var { verify, sign } = jsonwebtoken;
 
 // src/express.ts
 import requestIP from "request-ip";
-import fs5 from "fs-extra";
+import fs6 from "fs-extra";
 import EventEmitter from "events";
 var isDev = process.env.NODE_ENV === "development";
 var OnInitEmitter = class extends EventEmitter {
@@ -492,7 +510,7 @@ function filePathToURLPath(pathName, isDist = true) {
 
 // src/build/css.ts
 import { globSync as globSync2 } from "glob";
-import fs6 from "fs-extra";
+import fs7 from "fs-extra";
 import postcss from "postcss";
 
 // src/build/postcss/remove-layers.ts
@@ -561,15 +579,15 @@ async function buildCSS(disableTailwind2) {
   const cssFiles = globSync2(config.srcDir + "/**/*.css");
   for (const file of cssFiles) {
     try {
-      const fileContents = fs6.readFileSync(file, "utf-8");
+      const fileContents = fs7.readFileSync(file, "utf-8");
       let result = fileContents;
       if (!disableTailwind2) {
         result = await postcss([add_breakpoint_data_default()]).process(fileContents, { from: file });
         result = await postcss([tailwindPostcss(), remove_layers_default()]).process(result.css, { from: file });
       }
       const newPath = file.replace(config.srcDir, config.distDir);
-      fs6.ensureFileSync(newPath);
-      fs6.writeFileSync(newPath, result.css);
+      fs7.ensureFileSync(newPath);
+      fs7.writeFileSync(newPath, result.css);
     } catch (err) {
       console.error(err);
     }
@@ -579,7 +597,7 @@ async function buildCSS(disableTailwind2) {
 
 // src/scripts/build.ts
 var extensions = [".ts", ".tsx"];
-var packageJson = JSON.parse(fs7.readFileSync(config.packageJsonPath, "utf-8"));
+var packageJson = JSON.parse(fs8.readFileSync(config.packageJsonPath, "utf-8"));
 var allPackages = Object.keys(packageJson.devDependencies).concat(Object.keys(packageJson.dependencies));
 var xpineDistDir = getXPineDistDir();
 async function buildApp(args) {
@@ -587,7 +605,7 @@ async function buildApp(args) {
   const removePreviousBuild2 = args?.removePreviousBuild || false;
   const disableTailwind2 = args?.disableTailwind || false;
   try {
-    if (removePreviousBuild2) fs7.removeSync(config.distDir);
+    if (removePreviousBuild2) fs8.removeSync(config.distDir);
     const srcDirFiles = globSync3(config.srcDir + "/**/*.{js,ts,tsx,jsx}");
     const { componentData, dataFiles } = await buildAppFiles(srcDirFiles, isDev3);
     const clientSideBundles = [];
@@ -612,7 +630,7 @@ async function buildApp(args) {
       const alpineDataFile = await buildAlpineDataFile(componentData, dataFiles);
       await buildClientSideFiles([alpineDataFile, ...clientSideBundles], isDev3);
     }
-    fs7.removeSync(config.distTempFolder);
+    fs8.removeSync(config.distTempFolder);
     await buildCSS(disableTailwind2);
     await buildPublicFolderSymlinks();
     await buildOnLoadFile(componentData, isDev3);
@@ -633,7 +651,7 @@ async function buildAppFiles(files, isDev3) {
     return fileName === "+config";
   });
   const backendFiles = files.filter((file) => extensions?.find((ext) => file.endsWith(ext))).filter((file) => !file.startsWith(config.publicDir));
-  fs7.ensureDirSync(config.distDir);
+  fs8.ensureDirSync(config.distDir);
   await build({
     entryPoints: backendFiles,
     format: "esm",
@@ -657,8 +675,8 @@ async function buildAppFiles(files, isDev3) {
   };
 }
 async function buildClientSideFiles(alpineDataFiles = [], isDev3, tempClientSidePath, id) {
-  const tempFilePath = path5.join(config.distTempFolder, tempClientSidePath || "./app.ts");
-  fs7.ensureFileSync(tempFilePath);
+  const tempFilePath = path6.join(config.distTempFolder, tempClientSidePath || "./app.ts");
+  fs8.ensureFileSync(tempFilePath);
   const pagesScriptsGlob = config.publicDir + "/scripts/pages/**/*.{js,ts}";
   const standaloneFolderGlob = config.publicDir + "/standalone/**/*.*";
   const clientFiles = globSync3(
@@ -691,14 +709,14 @@ async function buildClientSideFiles(alpineDataFiles = [], isDev3, tempClientSide
   await logSize(config.distPublicDir, id ? `client bundle: ${id}.js` : "client bundle: app.js");
 }
 function writeDevServerClientSideCode(tempFilePath) {
-  const devServerPath = path5.join(xpineDistDir, "./src/static/dev-server.js");
-  const content = fs7.readFileSync(devServerPath, "utf-8");
-  fs7.appendFileSync(tempFilePath, "\n" + content);
+  const devServerPath = path6.join(xpineDistDir, "./src/static/dev-server.js");
+  const content = fs8.readFileSync(devServerPath, "utf-8").replace("__XPINE_WS_PORT__", String(getDevServerWsPort()));
+  fs8.appendFileSync(tempFilePath, "\n" + content);
 }
 function writeSpaClientSideCode(tempFilePath) {
-  const spaPath = path5.join(xpineDistDir, "./src/static/spa.js");
-  const content = fs7.readFileSync(spaPath, "utf-8");
-  fs7.appendFileSync(tempFilePath, "\n" + content);
+  const spaPath = path6.join(xpineDistDir, "./src/static/spa.js");
+  const content = fs8.readFileSync(spaPath, "utf-8");
+  fs8.appendFileSync(tempFilePath, "\n" + content);
 }
 async function buildAlpineDataFile(componentData, dataFiles, bundleID) {
   const output = {
@@ -745,13 +763,13 @@ async function buildAlpineDataFile(componentData, dataFiles, bundleID) {
   }
   const result = output.imports.join("\n") + "\n" + output.code.join("\n") + "\n" + output.end.join("\n");
   if (bundleID) {
-    const bundlePath = path5.join(config.distTempFolder, `./alpine-data-${bundleID}.ts`);
-    fs7.ensureFileSync(bundlePath);
-    fs7.writeFileSync(bundlePath, result);
+    const bundlePath = path6.join(config.distTempFolder, `./alpine-data-${bundleID}.ts`);
+    fs8.ensureFileSync(bundlePath);
+    fs8.writeFileSync(bundlePath, result);
     return bundlePath;
   } else {
-    fs7.ensureFileSync(config.alpineDataPath);
-    fs7.writeFileSync(config.alpineDataPath, result);
+    fs8.ensureFileSync(config.alpineDataPath);
+    fs8.writeFileSync(config.alpineDataPath, result);
     return config.alpineDataPath;
   }
 }
@@ -769,8 +787,8 @@ async function buildPublicFolderSymlinks() {
       const splitNewPath = newPath.split("/");
       splitNewPath.pop();
       const newDir = splitNewPath.join("/");
-      fs7.ensureDirSync(newDir);
-      fs7.symlinkSync(file, newPath);
+      fs8.ensureDirSync(newDir);
+      fs8.symlinkSync(file, newPath);
     } catch {
     }
   }
@@ -781,8 +799,8 @@ async function buildPublicFolderSymlinks() {
       const updatedNewPath = splitNewPath.join("/");
       splitNewPath.pop();
       const newDir = splitNewPath.join("/");
-      fs7.ensureDirSync(newDir);
-      fs7.symlinkSync(file, updatedNewPath);
+      fs8.ensureDirSync(newDir);
+      fs8.symlinkSync(file, updatedNewPath);
     } catch {
     }
   }
@@ -793,7 +811,7 @@ async function logSize(pathName, type, validExtensions = [".js", ".css"]) {
     if (!validExtensions?.find((ext) => file.endsWith(ext))) return false;
     return {
       file,
-      size: fs7.statSync(file).size / (1024 * 1e3)
+      size: fs8.statSync(file).size / (1024 * 1e3)
     };
   }).filter(Boolean);
   const totalSize = fileSizes.reduce((total, current) => {
@@ -851,9 +869,9 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
         routePath: urlPath
       };
       const staticComponentOutput = await componentFn({ data, routePath: urlPath, req });
-      const htmlOutputPath = path5.join(outputPath, "./index.html");
-      fs7.ensureFileSync(htmlOutputPath);
-      fs7.writeFileSync(
+      const htmlOutputPath = path6.join(outputPath, "./index.html");
+      fs8.ensureFileSync(htmlOutputPath);
+      fs8.writeFileSync(
         htmlOutputPath,
         doctypeHTML + (config2?.wrapper ? await config2.wrapper({ req, children: staticComponentOutput, config: config2, data, routePath: urlPath }) : staticComponentOutput) + staticComment
       );
@@ -865,7 +883,7 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
     const dynamicPaths = await config2.staticPaths();
     for (const dynamicPath of dynamicPaths) {
       try {
-        const updatedOutDir = path5.join(outputPath, `./${componentDynamicPaths.map((key) => dynamicPath[key]).join("/")}`);
+        const updatedOutDir = path6.join(outputPath, `./${componentDynamicPaths.map((key) => dynamicPath[key]).join("/")}`);
         const urlPath = filePathToURLPath(updatedOutDir);
         const req = {
           params: {
@@ -879,9 +897,9 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
         let data = config2?.data ? await config2.data(req) : null;
         data = { ...data, routePath: urlPath };
         const staticComponentOutput = await componentFn({ req, data, routePath: urlPath });
-        fs7.ensureDirSync(updatedOutDir);
-        fs7.writeFileSync(
-          path5.join(updatedOutDir, "./index.html"),
+        fs8.ensureDirSync(updatedOutDir);
+        fs8.writeFileSync(
+          path6.join(updatedOutDir, "./index.html"),
           doctypeHTML + (config2?.wrapper ? await config2.wrapper({ req, children: staticComponentOutput, config: config2, data, routePath: urlPath }) : staticComponentOutput) + staticComment
         );
       } catch (err) {
@@ -895,10 +913,10 @@ function determineOutputPathForStaticPath(builtComponentPath, componentDynamicPa
   if (componentDynamicPaths?.length) {
     return componentDynamicPaths.reduce((total, current) => {
       return total.replace(`/[...${current}]`, "").replace(`/[${current}]`, "");
-    }, path5.dirname(builtComponentPath));
+    }, path6.dirname(builtComponentPath));
   } else {
     if (builtComponentPath?.match(regex_default.endsWithIndex)) {
-      return path5.dirname(builtComponentPath);
+      return path6.dirname(builtComponentPath);
     } else {
       if (!builtComponentPath.match(regex_default.endsWithJs)) return null;
       return builtComponentPath.replace(regex_default.endsWithJs, "");
@@ -945,8 +963,8 @@ async function buildOnLoadFile(componentData, isDev3) {
       context.runArrayQueue();
     }
   `;
-  const onLoadFilePath = path5.join(config.distDir, "./__xpineOnLoad.ts");
-  fs7.writeFileSync(onLoadFilePath, output);
+  const onLoadFilePath = path6.join(config.distDir, "./__xpineOnLoad.ts");
+  fs8.writeFileSync(onLoadFilePath, output);
   await build({
     entryPoints: [onLoadFilePath],
     format: "esm",
@@ -1001,8 +1019,8 @@ async function buildSitemap() {
   }).join("\n")}
     </urlset>
   `;
-  fs7.ensureFileSync(config.sitemapPath);
-  fs7.writeFileSync(config.sitemapPath, minifyXML(sitemap));
+  fs8.ensureFileSync(config.sitemapPath);
+  fs8.writeFileSync(config.sitemapPath, minifyXML(sitemap));
 }
 
 // src/scripts/xpine-build.ts

package/dist/src/scripts/xpine-dev.js

@@ -8,8 +8,8 @@ import EventEmitter2 from "events";
 import chokidar from "chokidar";
 
 // src/scripts/build.ts
-import path5 from "path";
-import fs7 from "fs-extra";
+import path6 from "path";
+import fs8 from "fs-extra";
 import { build } from "esbuild";
 import micromatch from "micromatch";
 import minifyXML from "minify-xml";
@@ -307,18 +307,27 @@ async function triggerXPineOnLoad(noCache = false) {
 import { globSync as globSync3 } from "glob";
 
 // src/util/paths.ts
+import path3 from "path";
+import fs2 from "fs";
 function getXPineDistDir() {
-  const dir = import.meta.dirname;
-  const splitDir = dir.split("/xpine/dist");
-  if (splitDir.length === 1) {
-    const splitDirSingle = dir.split("/xpine/");
-    return splitDirSingle[0] + "/xpine/dist";
+  let dir = import.meta.dirname;
+  while (true) {
+    const packageJsonPath = path3.join(dir, "package.json");
+    if (fs2.existsSync(packageJsonPath)) {
+      try {
+        const packageJson2 = JSON.parse(fs2.readFileSync(packageJsonPath, "utf-8"));
+        if (packageJson2?.name === "xpine") return path3.join(dir, "dist");
+      } catch {
+      }
+    }
+    const parent = path3.dirname(dir);
+    if (parent === dir) throw new Error(`Could not find the xpine package root from ${import.meta.dirname}`);
+    dir = parent;
   }
-  return splitDir[0] + "/xpine/dist";
 }
 
 // src/build/esbuild/transformTSXFiles.ts
-import fs2 from "fs-extra";
+import fs3 from "fs-extra";
 import ts2 from "typescript";
 
 // src/util/regex.ts
@@ -345,14 +354,14 @@ var regex_default = {
 };
 
 // src/util/config-file.ts
-import path3 from "path";
+import path4 from "path";
 function sourcePathToDistPath(sourcePath) {
   return sourcePath?.replace(config.srcDir, config.distDir)?.replace(/\.ts$/, ".js")?.replace(/\.tsx$/, ".js");
 }
 function getConfigFiles(pathName, pageConfigFiles, returnDistPaths = true) {
   const configs = [];
   for (const configFile of pageConfigFiles) {
-    const result = path3.relative(pathName, configFile)?.replace(regex_default.configFile, "");
+    const result = path4.relative(pathName, configFile)?.replace(regex_default.configFile, "");
     const hasLetters = result.match(regex_default.hasLetters);
     if (!hasLetters) {
       configs.push(returnDistPaths ? sourcePathToDistPath(configFile) : configFile);
@@ -381,7 +390,7 @@ function transformTSXFiles(componentData, pageConfigFiles) {
     name: "transform-tsx-files",
     setup(build2) {
       build2.onLoad({ filter: regex_default.dotTsx }, async (args) => {
-        const content = fs2.readFileSync(args.path, "utf-8");
+        const content = fs3.readFileSync(args.path, "utf-8");
         const source = ts2.createSourceFile(
           args.path,
           content,
@@ -409,8 +418,8 @@ function transformTSXFiles(componentData, pageConfigFiles) {
 }
 
 // src/build/esbuild/addDotJS.ts
-import fs3 from "fs-extra";
-import path4 from "path";
+import fs4 from "fs-extra";
+import path5 from "path";
 import builtinModules from "builtin-modules";
 function addDotJS(allPackages2, extensions2, isDev2) {
   const allPackagesIncludingNode = allPackages2.concat(builtinModules);
@@ -421,11 +430,11 @@ function addDotJS(allPackages2, extensions2, isDev2) {
         const hasAtSign = args.path.startsWith("@");
         const isPackage = hasAtSign ? allPackagesIncludingNode.includes(args.path) : allPackagesIncludingNode.includes(args.path.split("/").shift());
         if (args.importer && !isPackage) {
-          const calculatedDir = path4.join(args.resolveDir, args.path);
+          const calculatedDir = path5.join(args.resolveDir, args.path);
           let existsAsFile = false;
           for (const extension of extensions2) {
             const asFile = calculatedDir + extension;
-            const exists = fs3.existsSync(asFile);
+            const exists = fs4.existsSync(asFile);
             if (exists) existsAsFile = true;
           }
           let outputPath = args.path + (existsAsFile ? "" : "/index") + ".js";
@@ -438,13 +447,13 @@ function addDotJS(allPackages2, extensions2, isDev2) {
 }
 
 // src/build/esbuild/getDataFiles.ts
-import fs4 from "fs-extra";
+import fs5 from "fs-extra";
 function getDataFiles(dataFiles) {
   return {
     name: "get-data-files",
     setup(build2) {
       build2.onLoad({ filter: /\.data\.(js|mjs|ts)$/ }, (args) => {
-        const contents = fs4.readFileSync(args.path, "utf-8");
+        const contents = fs5.readFileSync(args.path, "utf-8");
         dataFiles.push({
           ...args,
           contents
@@ -462,6 +471,15 @@ function getDataFiles(dataFiles) {
 var doctypeHTML = "<!DOCTYPE html>";
 var staticComment = "<!-- static -->";
 
+// src/util/dev-server-port.ts
+function getDevServerWsPort() {
+  const wsPort = Number.parseInt(process.env.WS_PORT || "", 10);
+  if (Number.isInteger(wsPort) && wsPort > 0) return wsPort;
+  const appPort = Number.parseInt(process.env.PORT || "", 10);
+  if (Number.isInteger(appPort) && appPort > 0) return appPort + 1;
+  return 3001;
+}
+
 // src/scripts/build.ts
 import ts3 from "typescript";
 
@@ -475,7 +493,7 @@ var { verify, sign } = jsonwebtoken;
 
 // src/express.ts
 import requestIP from "request-ip";
-import fs5 from "fs-extra";
+import fs6 from "fs-extra";
 import EventEmitter from "events";
 var isDev = process.env.NODE_ENV === "development";
 var OnInitEmitter = class extends EventEmitter {
@@ -499,7 +517,7 @@ function filePathToURLPath(pathName, isDist = true) {
 
 // src/build/css.ts
 import { globSync as globSync2 } from "glob";
-import fs6 from "fs-extra";
+import fs7 from "fs-extra";
 import postcss from "postcss";
 
 // src/build/postcss/remove-layers.ts
@@ -568,15 +586,15 @@ async function buildCSS(disableTailwind) {
   const cssFiles = globSync2(config.srcDir + "/**/*.css");
   for (const file of cssFiles) {
     try {
-      const fileContents = fs6.readFileSync(file, "utf-8");
+      const fileContents = fs7.readFileSync(file, "utf-8");
       let result = fileContents;
       if (!disableTailwind) {
         result = await postcss([add_breakpoint_data_default()]).process(fileContents, { from: file });
         result = await postcss([tailwindPostcss(), remove_layers_default()]).process(result.css, { from: file });
       }
       const newPath = file.replace(config.srcDir, config.distDir);
-      fs6.ensureFileSync(newPath);
-      fs6.writeFileSync(newPath, result.css);
+      fs7.ensureFileSync(newPath);
+      fs7.writeFileSync(newPath, result.css);
     } catch (err) {
       console.error(err);
     }
@@ -586,7 +604,7 @@ async function buildCSS(disableTailwind) {
 
 // src/scripts/build.ts
 var extensions = [".ts", ".tsx"];
-var packageJson = JSON.parse(fs7.readFileSync(config.packageJsonPath, "utf-8"));
+var packageJson = JSON.parse(fs8.readFileSync(config.packageJsonPath, "utf-8"));
 var allPackages = Object.keys(packageJson.devDependencies).concat(Object.keys(packageJson.dependencies));
 var xpineDistDir = getXPineDistDir();
 async function buildApp(args) {
@@ -594,7 +612,7 @@ async function buildApp(args) {
   const removePreviousBuild = args?.removePreviousBuild || false;
   const disableTailwind = args?.disableTailwind || false;
   try {
-    if (removePreviousBuild) fs7.removeSync(config.distDir);
+    if (removePreviousBuild) fs8.removeSync(config.distDir);
     const srcDirFiles = globSync3(config.srcDir + "/**/*.{js,ts,tsx,jsx}");
     const { componentData, dataFiles } = await buildAppFiles(srcDirFiles, isDev2);
     const clientSideBundles = [];
@@ -619,7 +637,7 @@ async function buildApp(args) {
       const alpineDataFile = await buildAlpineDataFile(componentData, dataFiles);
       await buildClientSideFiles([alpineDataFile, ...clientSideBundles], isDev2);
     }
-    fs7.removeSync(config.distTempFolder);
+    fs8.removeSync(config.distTempFolder);
     await buildCSS(disableTailwind);
     await buildPublicFolderSymlinks();
     await buildOnLoadFile(componentData, isDev2);
@@ -640,7 +658,7 @@ async function buildAppFiles(files, isDev2) {
     return fileName === "+config";
   });
   const backendFiles = files.filter((file) => extensions?.find((ext) => file.endsWith(ext))).filter((file) => !file.startsWith(config.publicDir));
-  fs7.ensureDirSync(config.distDir);
+  fs8.ensureDirSync(config.distDir);
   await build({
     entryPoints: backendFiles,
     format: "esm",
@@ -664,8 +682,8 @@ async function buildAppFiles(files, isDev2) {
   };
 }
 async function buildClientSideFiles(alpineDataFiles = [], isDev2, tempClientSidePath, id) {
-  const tempFilePath = path5.join(config.distTempFolder, tempClientSidePath || "./app.ts");
-  fs7.ensureFileSync(tempFilePath);
+  const tempFilePath = path6.join(config.distTempFolder, tempClientSidePath || "./app.ts");
+  fs8.ensureFileSync(tempFilePath);
   const pagesScriptsGlob = config.publicDir + "/scripts/pages/**/*.{js,ts}";
   const standaloneFolderGlob = config.publicDir + "/standalone/**/*.*";
   const clientFiles = globSync3(
@@ -698,14 +716,14 @@ async function buildClientSideFiles(alpineDataFiles = [], isDev2, tempClientSide
   await logSize(config.distPublicDir, id ? `client bundle: ${id}.js` : "client bundle: app.js");
 }
 function writeDevServerClientSideCode(tempFilePath) {
-  const devServerPath = path5.join(xpineDistDir, "./src/static/dev-server.js");
-  const content = fs7.readFileSync(devServerPath, "utf-8");
-  fs7.appendFileSync(tempFilePath, "\n" + content);
+  const devServerPath = path6.join(xpineDistDir, "./src/static/dev-server.js");
+  const content = fs8.readFileSync(devServerPath, "utf-8").replace("__XPINE_WS_PORT__", String(getDevServerWsPort()));
+  fs8.appendFileSync(tempFilePath, "\n" + content);
 }
 function writeSpaClientSideCode(tempFilePath) {
-  const spaPath = path5.join(xpineDistDir, "./src/static/spa.js");
-  const content = fs7.readFileSync(spaPath, "utf-8");
-  fs7.appendFileSync(tempFilePath, "\n" + content);
+  const spaPath = path6.join(xpineDistDir, "./src/static/spa.js");
+  const content = fs8.readFileSync(spaPath, "utf-8");
+  fs8.appendFileSync(tempFilePath, "\n" + content);
 }
 async function buildAlpineDataFile(componentData, dataFiles, bundleID) {
   const output = {
@@ -752,13 +770,13 @@ async function buildAlpineDataFile(componentData, dataFiles, bundleID) {
   }
   const result = output.imports.join("\n") + "\n" + output.code.join("\n") + "\n" + output.end.join("\n");
   if (bundleID) {
-    const bundlePath = path5.join(config.distTempFolder, `./alpine-data-${bundleID}.ts`);
-    fs7.ensureFileSync(bundlePath);
-    fs7.writeFileSync(bundlePath, result);
+    const bundlePath = path6.join(config.distTempFolder, `./alpine-data-${bundleID}.ts`);
+    fs8.ensureFileSync(bundlePath);
+    fs8.writeFileSync(bundlePath, result);
     return bundlePath;
   } else {
-    fs7.ensureFileSync(config.alpineDataPath);
-    fs7.writeFileSync(config.alpineDataPath, result);
+    fs8.ensureFileSync(config.alpineDataPath);
+    fs8.writeFileSync(config.alpineDataPath, result);
     return config.alpineDataPath;
   }
 }
@@ -776,8 +794,8 @@ async function buildPublicFolderSymlinks() {
       const splitNewPath = newPath.split("/");
       splitNewPath.pop();
       const newDir = splitNewPath.join("/");
-      fs7.ensureDirSync(newDir);
-      fs7.symlinkSync(file, newPath);
+      fs8.ensureDirSync(newDir);
+      fs8.symlinkSync(file, newPath);
     } catch {
     }
   }
@@ -788,8 +806,8 @@ async function buildPublicFolderSymlinks() {
       const updatedNewPath = splitNewPath.join("/");
       splitNewPath.pop();
       const newDir = splitNewPath.join("/");
-      fs7.ensureDirSync(newDir);
-      fs7.symlinkSync(file, updatedNewPath);
+      fs8.ensureDirSync(newDir);
+      fs8.symlinkSync(file, updatedNewPath);
     } catch {
     }
   }
@@ -800,7 +818,7 @@ async function logSize(pathName, type, validExtensions = [".js", ".css"]) {
     if (!validExtensions?.find((ext) => file.endsWith(ext))) return false;
     return {
       file,
-      size: fs7.statSync(file).size / (1024 * 1e3)
+      size: fs8.statSync(file).size / (1024 * 1e3)
     };
   }).filter(Boolean);
   const totalSize = fileSizes.reduce((total, current) => {
@@ -858,9 +876,9 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
         routePath: urlPath
       };
       const staticComponentOutput = await componentFn({ data, routePath: urlPath, req });
-      const htmlOutputPath = path5.join(outputPath, "./index.html");
-      fs7.ensureFileSync(htmlOutputPath);
-      fs7.writeFileSync(
+      const htmlOutputPath = path6.join(outputPath, "./index.html");
+      fs8.ensureFileSync(htmlOutputPath);
+      fs8.writeFileSync(
         htmlOutputPath,
         doctypeHTML + (config2?.wrapper ? await config2.wrapper({ req, children: staticComponentOutput, config: config2, data, routePath: urlPath }) : staticComponentOutput) + staticComment
       );
@@ -872,7 +890,7 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
     const dynamicPaths = await config2.staticPaths();
     for (const dynamicPath of dynamicPaths) {
       try {
-        const updatedOutDir = path5.join(outputPath, `./${componentDynamicPaths.map((key) => dynamicPath[key]).join("/")}`);
+        const updatedOutDir = path6.join(outputPath, `./${componentDynamicPaths.map((key) => dynamicPath[key]).join("/")}`);
         const urlPath = filePathToURLPath(updatedOutDir);
         const req = {
           params: {
@@ -886,9 +904,9 @@ async function buildStaticFiles(config2, component, componentImport, builtCompon
         let data = config2?.data ? await config2.data(req) : null;
         data = { ...data, routePath: urlPath };
         const staticComponentOutput = await componentFn({ req, data, routePath: urlPath });
-        fs7.ensureDirSync(updatedOutDir);
-        fs7.writeFileSync(
-          path5.join(updatedOutDir, "./index.html"),
+        fs8.ensureDirSync(updatedOutDir);
+        fs8.writeFileSync(
+          path6.join(updatedOutDir, "./index.html"),
           doctypeHTML + (config2?.wrapper ? await config2.wrapper({ req, children: staticComponentOutput, config: config2, data, routePath: urlPath }) : staticComponentOutput) + staticComment
         );
       } catch (err) {
@@ -902,10 +920,10 @@ function determineOutputPathForStaticPath(builtComponentPath, componentDynamicPa
   if (componentDynamicPaths?.length) {
     return componentDynamicPaths.reduce((total, current) => {
       return total.replace(`/[...${current}]`, "").replace(`/[${current}]`, "");
-    }, path5.dirname(builtComponentPath));
+    }, path6.dirname(builtComponentPath));
   } else {
     if (builtComponentPath?.match(regex_default.endsWithIndex)) {
-      return path5.dirname(builtComponentPath);
+      return path6.dirname(builtComponentPath);
     } else {
       if (!builtComponentPath.match(regex_default.endsWithJs)) return null;
       return builtComponentPath.replace(regex_default.endsWithJs, "");
@@ -952,8 +970,8 @@ async function buildOnLoadFile(componentData, isDev2) {
       context.runArrayQueue();
     }
   `;
-  const onLoadFilePath = path5.join(config.distDir, "./__xpineOnLoad.ts");
-  fs7.writeFileSync(onLoadFilePath, output);
+  const onLoadFilePath = path6.join(config.distDir, "./__xpineOnLoad.ts");
+  fs8.writeFileSync(onLoadFilePath, output);
   await build({
     entryPoints: [onLoadFilePath],
     format: "esm",
@@ -1008,20 +1026,20 @@ async function buildSitemap() {
   }).join("\n")}
     </urlset>
   `;
-  fs7.ensureFileSync(config.sitemapPath);
-  fs7.writeFileSync(config.sitemapPath, minifyXML(sitemap));
+  fs8.ensureFileSync(config.sitemapPath);
+  fs8.writeFileSync(config.sitemapPath, minifyXML(sitemap));
 }
 
 // src/runDevServer.ts
-import path7 from "path";
+import path8 from "path";
 
 // src/util/env.ts
 import dotenv from "dotenv";
-import path6 from "path";
+import path7 from "path";
 import { GetSecretValueCommand, SecretsManagerClient } from "@aws-sdk/client-secrets-manager";
 async function setupEnv() {
   if (process.env.HAS_SETUP_ENV) return;
-  dotenv.config({ path: path6.join(config.rootDir, `./.env.${process.env.STAGE || "dev"}`) });
+  dotenv.config({ path: path7.join(config.rootDir, `./.env.${process.env.STAGE || "dev"}`) });
   await loadSecretsManagerSecrets();
   process.env.HAS_SETUP_ENV = "true";
 }
@@ -1058,12 +1076,12 @@ async function runDevServer() {
   const watcher = chokidar.watch(config.srcDir, {
     ignoreInitial: true,
     // Ignore map and prisma files
-    ignored: (pathName) => pathName.endsWith(".map") || pathName.startsWith(path7.join(config.serverDir, "./prisma"))
+    ignored: (pathName) => pathName.endsWith(".map") || pathName.startsWith(path8.join(config.serverDir, "./prisma"))
   });
-  watcher.on("all", async (event, path8) => {
-    const isRegularExpressRoute = path8.startsWith(config.pagesDir) && (path8.endsWith(".ts") || path8.endsWith(".js"));
-    const isServerDir = path8.startsWith(config.serverDir) && !path8.startsWith(config.runDir);
-    const shouldReloadServer = isServerDir || isRegularExpressRoute || ["add", "unlink"].includes(event) && path8.startsWith(config.pagesDir);
+  watcher.on("all", async (event, path9) => {
+    const isRegularExpressRoute = path9.startsWith(config.pagesDir) && (path9.endsWith(".ts") || path9.endsWith(".js"));
+    const isServerDir = path9.startsWith(config.serverDir) && !path9.startsWith(config.runDir);
+    const shouldReloadServer = isServerDir || isRegularExpressRoute || ["add", "unlink"].includes(event) && path9.startsWith(config.pagesDir);
     if (shouldReloadServer) {
       await asyncServerClose(appServer.server);
       rebuildEmitter.emit("rebuild-server");
@@ -1093,11 +1111,18 @@ async function runDevServer() {
       ws.send("refresh:client");
     });
   });
-  const wsPort = 3001;
+  const wsPort = getDevServerWsPort();
   wsServer.listen(wsPort);
   wsServer.on("listening", () => {
     console.info(`Dev server listening on port ${wsPort}`);
   });
+  wsServer.prependListener("error", (err) => {
+    if (err.code === "EADDRINUSE") {
+      console.error(`Live-reload port ${wsPort} is already in use (another dev server?). Set WS_PORT or PORT to use a different port.`);
+      process.exit(1);
+    }
+    throw err;
+  });
 }
 function asyncServerClose(server) {
   return new Promise((resolve) => {

package/dist/src/static/dev-server.js

@@ -1,6 +1,7 @@
 // src/static/dev-server.mjs
 var socketProtocol = "ws:";
-var echoSocketUrl = socketProtocol + "//" + window.location.hostname + ":3001/dev-server/";
+var wsPort = "__XPINE_WS_PORT__";
+var echoSocketUrl = socketProtocol + "//" + window.location.hostname + ":" + wsPort + "/dev-server/";
 var socket = new WebSocket(echoSocketUrl);
 socket.addEventListener("message", async (msg) => {
   if (msg.data === "refresh:client") {

package/dist/src/util/dev-server-port.d.ts

@@ -0,0 +1,2 @@
+export declare function getDevServerWsPort(): number;
+//# sourceMappingURL=dev-server-port.d.ts.map

package/dist/src/util/dev-server-port.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dev-server-port.d.ts","sourceRoot":"","sources":["../../../src/util/dev-server-port.ts"],"names":[],"mappings":"AAEA,wBAAgB,kBAAkB,IAAI,MAAM,CAM3C"}

package/dist/src/util/paths.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"paths.d.ts","sourceRoot":"","sources":["../../../src/util/paths.ts"],"names":[],"mappings":"AAAA,wBAAgB,eAAe,WAS9B"}
+{"version":3,"file":"paths.d.ts","sourceRoot":"","sources":["../../../src/util/paths.ts"],"names":[],"mappings":"AASA,wBAAgB,eAAe,WAgB9B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xpine",
-  "version": "0.0.60",
+  "version": "0.0.62",
   "main": "dist/index.js",
   "dependencies": {
     "@aws-sdk/client-secrets-manager": "^3.758.0",