elm-pages 3.0.0-beta.3 → 3.0.0-beta.31

package/generator/src/cli.js

@@ -1,21 +1,29 @@
 #!/usr/bin/env node
+"use strict";
+
+import * as build from "./build.js";
+import * as dev from "./dev-server.js";
+import * as init from "./init.js";
+import * as codegen from "./codegen.js";
+import * as fs from "node:fs";
+import * as path from "node:path";
+import { restoreColorSafe } from "./error-formatter.js";
+import * as renderer from "./render.js";
+import * as globby from "globby";
+import * as esbuild from "esbuild";
+import { rewriteElmJson } from "./rewrite-elm-json.js";
+import { ensureDirSync } from "./file-helpers.js";
+import * as url from "url";
+import { default as which } from "which";
+import * as commander from "commander";
+import { runElmCodegenInstall } from "./elm-codegen.js";
+import { packageVersion } from "./compatibility-key.js";
+import { resolveInputPathOrModuleName } from "./resolve-elm-module.js";
 
-const build = require("./build.js");
-const dirHelpers = require("./dir-helpers.js");
-const dev = require("./dev-server.js");
-const init = require("./init.js");
-const codegen = require("./codegen.js");
-const fs = require("fs");
-const path = require("path");
-const { restoreColorSafe } = require("./error-formatter");
-
-const commander = require("commander");
-const { compileCliApp } = require("./compile-elm.js");
-const { runElmCodegenInstall } = require("./elm-codegen.js");
 const Argument = commander.Argument;
 const Option = commander.Option;
-
-const packageVersion = require("../../package.json").version;
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
 async function main() {
   const program = new commander.Command();
@@ -36,9 +44,6 @@ async function main() {
     )
     .description("run a full site build")
     .action(async (options) => {
-      if (!options.keepCache) {
-        clearHttpAndPortCache();
-      }
       options.base = normalizeUrl(options.base);
       await build.run(options);
     });
@@ -69,9 +74,6 @@ async function main() {
     .option("--base <basePath>", "serve site under a base path", "/")
     .option("--https", "uses a https server")
     .action(async (options) => {
-      if (!options.keepCache) {
-        clearHttpAndPortCache();
-      }
       options.base = normalizeUrl(options.base);
       await dev.start(options);
     });
@@ -84,66 +86,170 @@ async function main() {
     });
 
   program
-    .command("codegen <moduleName>")
-    .description("run a generator")
+    .command("run <elmModulePath>")
+    .description("run an elm-pages script")
     .allowUnknownOption()
     .allowExcessArguments()
-    .action(async (moduleName, options, options2) => {
-      if (!/^[A-Z][a-zA-Z0-9_]*(\.[A-Z][a-zA-Z0-9_]*)*$/.test(moduleName)) {
-        throw `Invalid module name "${moduleName}", must be in the format of an Elm module`;
-      }
-      const splitModuleName = moduleName.split(".");
-      const expectedFilePath = path.join(
-        process.cwd(),
-        "codegen",
-        `${splitModuleName.join("/")}.elm`
+    .action(async (elmModulePath, options, options2) => {
+      const unprocessedCliOptions = options2.args.splice(
+        options2.processedArgs.length,
+        options2.args.length
       );
-      if (!fs.existsSync(expectedFilePath)) {
-        throw `I couldn't find a module named ${expectedFilePath}`;
-      }
       try {
-        await codegen.generate("");
-        await runElmCodegenInstall();
-        await compileCliApp(
-          // { debug: true },
-          {},
-          `${splitModuleName.join("/")}.elm`,
-          path.join(process.cwd(), "codegen/elm-stuff/scaffold.js"),
-          "codegen",
-
-          path.join(process.cwd(), "codegen/elm-stuff/scaffold.js")
+        await compileElmForScript(elmModulePath);
+
+        const { moduleName, projectDirectory, sourceDirectory } =
+          resolveInputPathOrModuleName(elmModulePath);
+
+        const portBackendTaskCompiled = esbuild
+          .build({
+            entryPoints: [path.join(projectDirectory, "./custom-backend-task")],
+            platform: "node",
+            outfile: path.join(
+              projectDirectory,
+              ".elm-pages/compiled-ports/custom-backend-task.mjs"
+            ),
+            assetNames: "[name]-[hash]",
+            chunkNames: "chunks/[name]-[hash]",
+            metafile: true,
+            bundle: true,
+            format: "esm",
+            packages: "external",
+            logLevel: "silent",
+          })
+          .then((result) => {
+            try {
+              return Object.keys(result.metafile.outputs)[0];
+            } catch (e) {
+              return null;
+            }
+          })
+          .catch((error) => {
+            const portBackendTaskFileFound =
+              globby.globbySync("./custom-backend-task.*").length > 0;
+            if (portBackendTaskFileFound) {
+              // don't present error if there are no files matching custom-backend-task
+              // if there are files matching custom-backend-task, warn the user in case something went wrong loading it
+              console.error(
+                "Failed to start custom-backend-task watcher",
+                error
+              );
+            }
+          });
+        const portsPath = await portBackendTaskCompiled;
+
+        const cwd = process.cwd();
+        process.chdir(projectDirectory);
+        // TODO have option for compiling with --debug or not (maybe allow running with elm-optimize-level-2 as well?)
+
+        let executableName = await lamderaOrElmFallback();
+        await build.compileCliApp({ debug: "debug", executableName });
+        fs.renameSync(
+          `${projectDirectory}/elm-stuff/elm-pages/elm.js`,
+          `${projectDirectory}/elm-stuff/elm-pages/elm.cjs`
+        );
+        process.chdir(cwd);
+        await renderer.runGenerator(
+          unprocessedCliOptions,
+          portsPath
+            ? await import(url.pathToFileURL(path.resolve(portsPath)).href)
+            : null,
+          await requireElm(`${projectDirectory}/elm-stuff/elm-pages/elm.cjs`),
+          moduleName
         );
       } catch (error) {
         console.log(restoreColorSafe(error));
         process.exit(1);
       }
+    });
+
+  program
+    .command("bundle-script <moduleName>")
+    .description("bundle an elm-pages script")
+    .option(
+      "--debug",
+      "Skip elm-optimize-level-2 and run elm make with --debug"
+    )
+    .option(
+      "--output <path>",
+      "Output path for compiled script",
+      "./myscript.mjs"
+    )
+    .option(
+      "--external <package-or-pattern>",
+      "build site to be served under a base path",
+      collect,
+      []
+    )
+    .action(async (elmModulePath, options, options2) => {
+      const { moduleName, projectDirectory, sourceDirectory } =
+        resolveInputPathOrModuleName(elmModulePath);
+      await compileElmForScript(elmModulePath);
 
-      const elmScaffoldProgram = getAt(
-        splitModuleName,
-        require(path.join(process.cwd(), "./codegen/elm-stuff/scaffold.js")).Elm
+      const cwd = process.cwd();
+      process.chdir(projectDirectory);
+      // TODO have option for compiling with --debug or not (maybe allow running with elm-optimize-level-2 as well?)
+
+      let executableName = await lamderaOrElmFallback();
+      await build.compileCliApp({ debug: options.debug, executableName });
+      fs.renameSync(
+        `${projectDirectory}/elm-stuff/elm-pages/elm.js`,
+        `${projectDirectory}/elm-stuff/elm-pages/elm.cjs`
       );
-      const program = elmScaffoldProgram.init({
-        flags: { argv: ["", ...options2.args], versionMessage: "1.2.3" },
-      });
+      process.chdir(cwd);
 
-      safeSubscribe(program, "print", (message) => {
-        console.log(message);
-      });
-      safeSubscribe(program, "printAndExitFailure", (message) => {
-        console.log(message);
+      try {
+        const { moduleName, projectDirectory, sourceDirectory } =
+          resolveInputPathOrModuleName(elmModulePath);
+
+        const portBackendTaskFileFound =
+          globby.globbySync(
+            path.join(projectDirectory, "custom-backend-task.*")
+          ).length > 0;
+
+        const scriptRunner = `${
+          portBackendTaskFileFound
+            ? `import * as customBackendTask from "${path.join(
+                projectDirectory,
+                "./custom-backend-task"
+              )}";`
+            : "const customBackendTask = {};"
+        }
+import * as renderer from "./render.js";
+import { default as Elm } from "${path.join(
+          projectDirectory,
+          "elm-stuff/elm-pages/elm.cjs"
+        )}";
+
+await renderer.runGenerator(
+  [...process.argv].splice(2),
+  customBackendTask,
+  Elm,
+  "${moduleName}"
+);
+        `;
+        // source: https://github.com/evanw/esbuild/pull/2067#issuecomment-1073039746
+        const ESM_REQUIRE_SHIM = `
+await(async()=>{let{dirname:e}=await import("path"),{fileURLToPath:i}=await import("url");if(typeof globalThis.__filename>"u"&&(globalThis.__filename=i(import.meta.url)),typeof globalThis.__dirname>"u"&&(globalThis.__dirname=e(globalThis.__filename)),typeof globalThis.require>"u"){let{default:a}=await import("module");globalThis.require=a.createRequire(import.meta.url)}})();
+`;
+
+        await esbuild.build({
+          format: "esm",
+          platform: "node",
+          stdin: { contents: scriptRunner, resolveDir: __dirname },
+          bundle: true,
+          // TODO do I need to make the outfile joined with the current working directory?
+
+          outfile: path.resolve(cwd, options.output),
+          external: ["node:*", ...options.external],
+          minify: true,
+          absWorkingDir: projectDirectory,
+          banner: { js: `#!/usr/bin/env node\n\n${ESM_REQUIRE_SHIM}` },
+        });
+      } catch (error) {
+        console.log(restoreColorSafe(error));
         process.exit(1);
-      });
-      safeSubscribe(program, "printAndExitSuccess", (message) => {
-        console.log(message);
-        process.exit(0);
-      });
-      safeSubscribe(program, "writeFile", async (info) => {
-        const filePath = path.join(process.cwd(), "app", info.path);
-        await dirHelpers.tryMkdir(path.dirname(filePath));
-        fs.writeFileSync(filePath, info.body);
-        console.log("Success! Created file", filePath);
-        process.exit(0);
-      });
+      }
     });
 
   program
@@ -152,7 +258,7 @@ async function main() {
     .option("--port <number>", "serve site at localhost:<port>", "8000")
     .action(async (options) => {
       await codegen.generate("/");
-      const DocServer = require("elm-doc-preview");
+      const DocServer = (await import("elm-doc-preview")).default;
       const server = new DocServer({
         port: options.port,
         browser: true,
@@ -180,29 +286,11 @@ function getAt(properties, object) {
 }
 
 function safeSubscribe(program, portName, subscribeFunction) {
-  program.ports[portName] &&
+  program.ports &&
+    program.ports[portName] &&
     program.ports[portName].subscribe(subscribeFunction);
 }
 
-function clearHttpAndPortCache() {
-  const directory = ".elm-pages/http-response-cache";
-  if (fs.existsSync(directory)) {
-    fs.readdir(directory, (err, files) => {
-      if (err) {
-        throw err;
-      }
-
-      for (const file of files) {
-        fs.unlink(path.join(directory, file), (err) => {
-          if (err) {
-            throw err;
-          }
-        });
-      }
-    });
-  }
-}
-
 /**
  * @param {string} rawPagePath
  */
@@ -218,5 +306,102 @@ function normalizeUrl(rawPagePath) {
   // with detecting whether the path contains the base.
   return `/${segments.join("/")}`;
 }
+/**
+ * @param {string} compiledElmPath
+ */
+async function requireElm(compiledElmPath) {
+  const warnOriginal = console.warn;
+  console.warn = function () {};
+
+  let Elm = (await import(path.resolve(compiledElmPath))).default;
+  console.warn = warnOriginal;
+  return Elm;
+}
+
+/**
+ * @param {string} moduleName
+ */
+function generatorWrapperFile(moduleName) {
+  return `port module Main exposing (main)
+
+import BackendTask exposing (BackendTask)
+import FatalError
+import Cli.Program as Program
+import Json.Decode as Decode
+import Json.Encode as Encode
+import Pages.Internal.Platform.GeneratorApplication
+import ${moduleName}
+
+
+main : Program.StatefulProgram Pages.Internal.Platform.GeneratorApplication.Model Pages.Internal.Platform.GeneratorApplication.Msg (BackendTask FatalError.FatalError ()) Pages.Internal.Platform.GeneratorApplication.Flags
+main =
+    Pages.Internal.Platform.GeneratorApplication.app
+        { data = ${moduleName}.run
+        , toJsPort = toJsPort
+        , fromJsPort = fromJsPort identity
+        , gotBatchSub = gotBatchSub identity
+        , sendPageData = \\_ -> Cmd.none
+        }
+
+
+port toJsPort : Encode.Value -> Cmd msg
+
+
+port fromJsPort : (Decode.Value -> msg) -> Sub msg
+
+
+port gotBatchSub : (Decode.Value -> msg) -> Sub msg
+`;
+}
+function collect(value, previous) {
+  return previous.concat([value]);
+}
+
+async function compileElmForScript(elmModulePath) {
+  const { moduleName, projectDirectory, sourceDirectory } =
+    resolveInputPathOrModuleName(elmModulePath);
+  const splitModuleName = moduleName.split(".");
+  const expectedFilePath = path.join(
+    sourceDirectory,
+    `${splitModuleName.join("/")}.elm`
+  );
+  if (!fs.existsSync(expectedFilePath)) {
+    throw `I couldn't find a module named ${expectedFilePath}`;
+  }
+  // await codegen.generate("");
+  ensureDirSync(path.join(process.cwd(), ".elm-pages", "http-response-cache"));
+  if (fs.existsSync("./codegen/")) {
+    await runElmCodegenInstall();
+  }
+
+  ensureDirSync(`${projectDirectory}/elm-stuff`);
+  ensureDirSync(`${projectDirectory}/elm-stuff/elm-pages/.elm-pages`);
+  await fs.promises.writeFile(
+    path.join(`${projectDirectory}/elm-stuff/elm-pages/.elm-pages/Main.elm`),
+    generatorWrapperFile(moduleName)
+  );
+  let executableName = await lamderaOrElmFallback();
+  try {
+    await which("lamdera");
+  } catch (error) {
+    await which("elm");
+    executableName = "elm";
+  }
+  await rewriteElmJson(
+    `${projectDirectory}/elm.json`,
+    `${projectDirectory}/elm-stuff/elm-pages/elm.json`,
+    { executableName }
+  );
+}
+
+async function lamderaOrElmFallback() {
+  try {
+    await which("lamdera");
+    return "lamdera";
+  } catch (error) {
+    await which("elm");
+    return "elm";
+  }
+}
 
 main();

package/generator/src/codegen.js

@@ -1,21 +1,24 @@
-const fs = require("fs");
-const fsExtra = require("fs-extra");
-const copyModifiedElmJson = require("./rewrite-elm-json.js");
-const copyModifiedElmJsonClient = require("./rewrite-client-elm-json.js");
-const { elmPagesCliFile, elmPagesUiFile } = require("./elm-file-constants.js");
-const spawnCallback = require("cross-spawn").spawn;
-const which = require("which");
-const {
-  generateTemplateModuleConnector,
-} = require("./generate-template-module-connector.js");
-const path = require("path");
-const { ensureDirSync, deleteIfExists } = require("./file-helpers.js");
+import * as fs from "node:fs";
+import * as fsExtra from "fs-extra";
+import { rewriteElmJson } from "./rewrite-elm-json.js";
+import { rewriteClientElmJson } from "./rewrite-client-elm-json.js";
+import { elmPagesCliFile, elmPagesUiFile } from "./elm-file-constants.js";
+import { spawn as spawnCallback } from "cross-spawn";
+import { default as which } from "which";
+import { generateTemplateModuleConnector } from "./generate-template-module-connector.js";
+
+import * as path from "path";
+import { ensureDirSync, deleteIfExists } from "./file-helpers.js";
+import { fileURLToPath } from "url";
 global.builtAt = new Date();
 
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 /**
  * @param {string} basePath
  */
-async function generate(basePath) {
+export async function generate(basePath) {
   const cliCode = await generateTemplateModuleConnector(basePath, "cli");
   const browserCode = await generateTemplateModuleConnector(
     basePath,
@@ -63,7 +66,7 @@ async function generate(basePath) {
       browserCode.fetcherModules
     ),
     // write modified elm.json to elm-stuff/elm-pages/
-    copyModifiedElmJson(),
+    rewriteElmJson("./elm.json", "./elm-stuff/elm-pages/elm.json"),
     // ...(await listFiles("./Pages/Internal")).map(copyToBoth),
   ]);
 }
@@ -85,7 +88,7 @@ async function newCopyBoth(modulePath) {
   );
 }
 
-async function generateClientFolder(basePath) {
+export async function generateClientFolder(basePath) {
   const browserCode = await generateTemplateModuleConnector(
     basePath,
     "browser"
@@ -97,7 +100,7 @@ async function generateClientFolder(basePath) {
   await newCopyBoth("SharedTemplate.elm");
   await newCopyBoth("SiteConfig.elm");
 
-  await copyModifiedElmJsonClient();
+  await rewriteClientElmJson();
   await fsExtra.copy("./app", "./elm-stuff/elm-pages/client/app", {
     recursive: true,
   });
@@ -174,15 +177,16 @@ async function copyToBoth(moduleToCopy) {
     copyFileEnsureDir(
       path.join(__dirname, moduleToCopy),
       path.join(`./.elm-pages/`, moduleToCopy)
-   ),
-   copyFileEnsureDir(
+    ),
+    copyFileEnsureDir(
       path.join(__dirname, moduleToCopy),
       path.join(`./elm-stuff/elm-pages/client/.elm-pages`, moduleToCopy)
-   ),
-  copyFileEnsureDir(
+    ),
+    copyFileEnsureDir(
       path.join(__dirname, moduleToCopy),
       path.join(`./elm-stuff/elm-pages/.elm-pages/`, moduleToCopy)
-   )]);
+    ),
+  ]);
 }
 
 /**
@@ -190,10 +194,10 @@ async function copyToBoth(moduleToCopy) {
  * @param {string} to
  */
 async function copyFileEnsureDir(from, to) {
-    await fs.promises.mkdir(path.dirname(to), {
-      recursive: true,
-    })
-    await fs.promises.copyFile(from, to)
+  await fs.promises.mkdir(path.dirname(to), {
+    recursive: true,
+  });
+  await fs.promises.copyFile(from, to);
 }
 
 /**
@@ -229,5 +233,3 @@ async function listFiles(dir) {
 function merge(arrays) {
   return [].concat.apply([], arrays);
 }
-
-module.exports = { generate, generateClientFolder };

package/generator/src/compatibility-key.js

@@ -0,0 +1,3 @@
+export const compatibilityKey = 12;
+
+export const packageVersion = "3.0.0-beta.31";

package/generator/src/compile-elm.js

@@ -1,18 +1,39 @@
-const spawnCallback = require("cross-spawn").spawn;
-const fs = require("fs");
-const fsHelpers = require("./dir-helpers.js");
-const fsPromises = require("fs").promises;
-const path = require("path");
-const kleur = require("kleur");
-const { inject } = require("elm-hot");
-const pathToClientElm = path.join(
-  process.cwd(),
-  "elm-stuff/elm-pages/",
-  "browser-elm.js"
-);
+import { spawn as spawnCallback } from "cross-spawn";
+import * as fs from "fs";
+import * as fsHelpers from "./dir-helpers.js";
+import * as fsPromises from "fs/promises";
+import * as path from "path";
+import * as kleur from "kleur/colors";
+import { inject } from "elm-hot";
+import { fileURLToPath } from "url";
+import { rewriteElmJson } from "./rewrite-elm-json-help.js";
+import { ensureDirSync } from "./file-helpers.js";
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
-async function compileElmForBrowser(options) {
-  await runElm(options, "./.elm-pages/Main.elm", pathToClientElm);
+export async function compileElmForBrowser(options) {
+  // TODO do I need to make sure this is run from the right cwd? Before it was run outside of this function in the global scope, need to make sure that doesn't change semantics.
+  const pathToClientElm = path.join(
+    process.cwd(),
+    "elm-stuff/elm-pages/",
+    "browser-elm.js"
+  );
+  const secretDir = path.join(process.cwd(), "elm-stuff/elm-pages/browser-elm");
+  await fsHelpers.tryMkdir(secretDir);
+  rewriteElmJson(process.cwd(), secretDir, function (elmJson) {
+    elmJson["source-directories"] = elmJson["source-directories"].map(
+      (item) => {
+        return "../../../" + item;
+      }
+    );
+    return elmJson;
+  });
+  await runElm(
+    options,
+    "../../../.elm-pages/Main.elm",
+    pathToClientElm,
+    secretDir
+  );
   return fs.promises.writeFile(
     "./.elm-pages/cache/elm.js",
     inject(await fs.promises.readFile(pathToClientElm, "utf-8")).replace(
@@ -26,7 +47,7 @@ async function compileElmForBrowser(options) {
   );
 }
 
-async function compileCliApp(
+export async function compileCliApp(
   options,
   elmEntrypointPath,
   outputPath,
@@ -79,7 +100,7 @@ function _HtmlAsJson_toJson(html) {
 `;
 
   await fsPromises.writeFile(
-    readFrom,
+    readFrom.replace(/\.js$/, ".cjs"),
     elmFileContent
       .replace(
         /return \$elm\$json\$Json\$Encode\$string\(.REPLACE_ME_WITH_JSON_STRINGIFY.\)/g,
@@ -132,9 +153,11 @@ function spawnElmMake(options, elmEntrypointPath, outputPath, cwd) {
       }
     );
     if (await fsHelpers.fileExists(outputPath)) {
-      await fsPromises.unlink(outputPath, {
-        force: true /* ignore errors if file doesn't exist */,
-      });
+      try {
+        await fsPromises.unlink(outputPath, {
+          force: true /* ignore errors if file doesn't exist */,
+        });
+      } catch (e) {}
     }
     let commandOutput = "";
 
@@ -211,7 +234,7 @@ async function runElm(options, elmEntrypointPath, outputPath, cwd) {
 /**
  * @param {string} [ cwd ]
  */
-async function runElmReview(cwd) {
+export async function runElmReview(cwd) {
   const startTime = Date.now();
   return new Promise((resolve, reject) => {
     const child = spawnCallback(
@@ -284,12 +307,6 @@ function elmOptimizeLevel2(outputPath, cwd) {
   });
 }
 
-module.exports = {
-  compileElmForBrowser,
-  runElmReview,
-  compileCliApp,
-};
-
 /**
  * @param {number} start
  * @param {number} subtract

package/generator/src/config.js

@@ -0,0 +1,39 @@
+import * as path from "path";
+
+export async function resolveConfig() {
+  const initialConfig = await await import(
+    path.join(process.cwd(), "elm-pages.config.mjs")
+  )
+    .then(async (elmPagesConfig) => {
+      return (
+        elmPagesConfig.default || {
+          headTagsTemplate: defaultHeadTagsTemplate,
+        }
+      );
+    })
+    .catch((error) => {
+      console.warn(
+        "No `elm-pages.config.mjs` file found. Using default config."
+      );
+      return {
+        headTagsTemplate: defaultHeadTagsTemplate,
+        vite: {},
+      };
+    });
+
+  return {
+    preloadTagForFile: function () {
+      return true;
+    },
+    headTagsTemplate: defaultHeadTagsTemplate,
+    vite: {},
+    ...initialConfig,
+  };
+}
+
+function defaultHeadTagsTemplate(context) {
+  return `
+<link rel="stylesheet" href="/style.css" />
+<meta name="generator" content="elm-pages v${context.cliVersion}" />
+`;
+}