@joystick.js/cli-canary 0.0.0-canary.67 → 0.0.0-canary.670

package/src/lib/build/buildFiles.js

@@ -1,270 +0,0 @@
-import fs from "fs-extra";
-import esbuild from "esbuild";
-import svg from "esbuild-plugin-svg";
-import filesToCopy from "../filesToCopy.js";
-import minifyFile from "../build/minifyFile.js";
-import browserPaths from "./browserPaths.js";
-import browserPathExclusions from "./browserPathExclusions.js";
-import nodePaths from "./nodePaths.js";
-import nodePathExclusions from "./nodePathExclusions.js";
-import buildPlugins from "./buildPlugins.js";
-import getCodeFrame from "./getCodeFrame.js";
-import onWarn from "./onWarn.js";
-
-const handleBuildException = (exception = {}, file = '') => {
-  try {
-    const error = exception?.errors && exception?.errors[0];
-    const snippet = fs.existsSync(file)
-      ? getCodeFrame(file, {
-        line: error?.location?.line,
-        column: error?.location?.column,
-      })
-      : null;
-
-    onWarn({
-      file,
-      stack: exception?.stack,
-      line: error?.location?.line,
-      column: error?.location?.column,
-      snippet,
-      lineWithError: error?.location?.lineText?.trim(),
-      message: error?.text,
-    });
-
-    return snippet;
-  } catch (exception) {
-    throw new Error(`[actionName.handleBuildException] ${exception.message}`);
-  }
-};
-
-const handleParseFilePathFromException = (exception = {}) => {
-  try {
-    const rawErrorMessage = exception?.message?.split(':');
-    return rawErrorMessage[1] && rawErrorMessage[1]?.replace('\n', '') || '';
-  } catch (exception) {
-    throw new Error(`[actionName.handleParseFilePathFromException] ${exception.message}`);
-  }
-};
-
-const handleBuildForNode = (nodePaths = [], options = {}) => {
-  try {
-    return esbuild.build({
-      platform: "node",
-      format: "esm",
-      bundle: false,
-      entryPoints: nodePaths?.map((file) => file.path),
-      // TODO: Make sure we don't need outbase here so the paths map correctly.
-      outdir: options?.outputPath || "./.joystick/build",
-      define: {
-        "process.env.NODE_ENV": `'${options?.environment}'`,
-      },
-      logLevel: "silent",
-      plugins: [
-        buildPlugins.warnNodeEnvironment,
-        buildPlugins.generateFileDependencyMap
-      ],
-    });
-  } catch (exception) {
-    throw new Error(`[buildFiles.handleBuildForNode] ${exception.message}`);
-  }
-};
-
-const handleBuildForBrowser = (browserPaths = [], options = {}) => {
-  try {
-    return esbuild.build({
-      target: "es2020",
-      platform: "browser",
-      format: "esm",
-      bundle: true,
-      entryPoints: browserPaths?.map((file) => file.path),
-      // TODO: Make sure we don't need outbase here so the paths map correctly.
-      outdir: options?.outputPath || "./.joystick/build",
-      define: {
-        "process.env.NODE_ENV": `'${options?.environment}'`,
-      },
-      logLevel: 'silent',
-      plugins: [
-        buildPlugins.warnNodeEnvironment,
-        buildPlugins.generateFileDependencyMap,
-        buildPlugins.bootstrapComponent,
-        svg(),
-      ]
-    });
-  } catch (exception) {
-    throw new Error(`[buildFiles.handleBuildForBrowser] ${exception.message}`);
-  }
-};
-
-const handleCopyFiles = (files = [], outputPath = '') => {
-  try {
-    for (let i = 0; i < files?.length; i += 1) {
-      const file = files[i];
-      const fileContents = fs.readFileSync(file.path);
-      
-      // NOTE: Using fs.outputFileSync() from fs-extra to ensure parent path is created
-      // if it doesn't exist (avoids need for separate fs.mkdirSync()).
-      fs.outputFileSync(
-        `${outputPath || "./.joystick/build"}/${file.path}`,
-        fileContents
-      );
-    }
-  } catch (exception) {
-    throw new Error(`[buildFiles.handleCopyFiles] ${exception.message}`);
-  }
-};
-
-const isNodePath = (path = '') => {
-  try {
-    return nodePaths.some((nodePath) => {
-      return path.includes(nodePath);
-    }) &&
-    !nodePathExclusions.some((nodeExclusionPath) => {
-      return path.includes(nodeExclusionPath);
-    });
-  } catch (exception) {
-    throw new Error(`[buildFiles.isNodePath] ${exception.message}`);
-  }
-};
-
-const isBrowserPath = (path = '') => {
-  try {
-    return browserPaths.some((browserPath) => {
-      return path.includes(browserPath);
-    }) &&
-    !browserPathExclusions.some((browserExclusionPath) => {
-      return path.includes(browserExclusionPath);
-    });
-  } catch (exception) {
-    throw new Error(`[buildFiles.isBrowserPath] ${exception.message}`);
-  }
-};
-
-const isNotJavaScript = (path = '') => {
-  try {
-    const extension = path.split(".").pop();
-    return extension && !extension.match(/js$/);
-  } catch (exception) {
-    throw new Error(`[buildFiles.isNotJavaScript] ${exception.message}`);
-  }
-};
-
-const isCopyPath = (path = '') => {
-  try {
-    const hasCopyRegexMatch = filesToCopy.some((fileToCopy) => {
-      return fileToCopy.regex.test(path);
-    });
-    
-    return isNotJavaScript(path) || hasCopyRegexMatch;
-  } catch (exception) {
-    throw new Error(`[buildFiles.isCopyPath] ${exception.message}`);
-  }
-};
-
-const getFilePlatform = (path = '') => {
-  try {
-    let platform = "";
-  
-    const isCopy = isCopyPath(path);
-    const isBrowser = isBrowserPath(path);
-    const isNode = isNodePath(path);
-    
-    if (isCopy) {
-      platform = "copy";
-    }
-
-    if (isBrowser) {
-      platform = "browser";
-    }
-
-    if (isNode) {
-      platform = "node";
-    }
-
-    return platform;
-  } catch (exception) {
-    throw new Error(`[buildFiles.getFilePlatform] ${exception.message}`);
-  }
-};
-
-const getFilesWithPlatform = (files = []) => {
-  try {
-    return files?.map((file = '') => {
-      return {
-        path: file,
-        platform: getFilePlatform(file),
-      };
-    });
-  } catch (exception) {
-    throw new Error(`[buildFiles.getFilesWithPlatform] ${exception.message}`);
-  }
-};
-
-const validateOptions = (options) => {
-  try {
-    if (!options) throw new Error('options object is required.');
-    if (!options.files) throw new Error('options.files is required.');
-    if (!options.environment) throw new Error('options.environment is required.');
-  } catch (exception) {
-    throw new Error(`[buildFiles.validateOptions] ${exception.message}`);
-  }
-};
-
-const buildFiles = async (options, { resolve, reject }) => {
-  try {
-    validateOptions(options);
-
-    const filesWithPlatform = getFilesWithPlatform(options?.files);
-    const copyFiles = filesWithPlatform?.filter((file) => file?.platform === 'copy');
-    const browserFiles = filesWithPlatform?.filter((file) => file?.platform === 'browser');
-    const nodeFiles = filesWithPlatform?.filter((file) => file?.platform === 'node');
-    
-    handleCopyFiles(copyFiles, options?.outputPath);
-    
-    const fileResults = await Promise.all([
-      handleBuildForBrowser(browserFiles, options).then(() => {
-        return { success: true };
-      }).catch((exception) => {
-        const file = handleParseFilePathFromException(exception);
-        const snippet = handleBuildException(exception, file);
-        
-        return {
-          success: false,
-          path: file,
-          error: {
-            stack: exception?.stack,
-            snippet,
-          },
-        };
-      }),
-      handleBuildForNode(nodeFiles, options).catch((exception) => {
-        const file = handleParseFilePathFromException(exception);
-        const snippet = handleBuildException(exception, file);
-        
-        return {
-          success: false,
-          path: file,
-          error: {
-            stack: exception?.stack,
-            snippet,
-          },
-        };
-      }),
-    ]);
-    
-    if (options?.environment !== 'development') {
-      await Promise.all([browserFiles, nodeFiles].map((file) => {
-        return minifyFile(`${options?.outputPath || "./.joystick/build"}/${file.path}`);
-      })); 
-    }
-    
-    resolve(fileResults);
-  } catch (exception) {
-    reject(`[buildFiles] ${exception.message}`);
-  }
-};
-
-export default (options) =>
-  new Promise((resolve, reject) => {
-    buildFiles(options, { resolve, reject });
-  });
-

package/src/lib/build/buildPlugins.js

@@ -1,222 +0,0 @@
-import fs from "fs";
-import chalk from "chalk";
-import updateFileMap from "./updateFileMap.js";
-import {
-  JOYSTICK_UI_REGEX,
-  EXPORT_DEFAULT_REGEX,
-  JOYSTICK_COMPONENT_REGEX,
-  JOYSTICK_COMMENT_REGEX,
-} from "../regexes.js";
-import generateId from "../generateId.js";
-import getPlatformSafePath from "../getPlatformSafePath.js";
-import setComponentId from "./setComponentId.js";
-
-export default {
-  bootstrapComponent: {
-    name: "bootstrapComponent",
-    setup(build) {
-      // NOTE: Generate SSR ID and then replace the necessary markup. Make contents a let so we can perform
-      // additional modifications below.
-      const ssrId = generateId();
-
-      build.onLoad({ filter: /\.js$/ }, (args = {}) => {
-        try {
-          const shouldSetSSRId = [getPlatformSafePath("ui/")].some(
-            (bootstrapTarget) => {
-              return args.path.includes(bootstrapTarget);
-            }
-          );
-          
-          const isLayoutComponent = [getPlatformSafePath("ui/layouts")].some(
-            (bootstrapTarget) => {
-              return args.path.includes(bootstrapTarget);
-            }
-          );
-          
-          const isPageComponent = [getPlatformSafePath("ui/pages")].some(
-            (bootstrapTarget) => {
-              return args.path.includes(bootstrapTarget);
-            }
-          );
-          
-          const isEmailComponent = [getPlatformSafePath("email/")].some(
-            (bootstrapTarget) => {
-              return args.path.includes(bootstrapTarget);
-            }
-          );
-
-          if (
-            shouldSetSSRId ||
-            isLayoutComponent ||
-            isPageComponent ||
-            isEmailComponent
-            ) {
-            const code = fs.readFileSync(
-              getPlatformSafePath(args.path),
-              "utf-8"
-            );
-
-            // NOTE: Check to see if we have a valid component file.
-            const joystickUIMatches = code.match(JOYSTICK_UI_REGEX) || [];
-            const joystickUIMatch = joystickUIMatches && joystickUIMatches[0];
-            const exportDefaultMatches = code.match(EXPORT_DEFAULT_REGEX) || [];
-            const exportDefaultMatch =
-              exportDefaultMatches && exportDefaultMatches[0];
-
-            if (joystickUIMatch && !exportDefaultMatch) {
-              console.log(" ");
-              console.warn(
-                chalk.yellowBright(
-                  `All Joystick components in the ui directory must have an export default statement (e.g., export default MyComponent, export default MyLayout, or export default MyPage). Please check the file at ${args.path}.`
-                )
-              );
-              console.log(" ");
-              return;
-            }
-
-            let contents = setComponentId(code)?.replace(
-              /\.component\(\/\*\*\//g,
-              ".component("
-              );
-
-            // contents = contents.replace(
-            //   "ui.component({",
-            //   `ui.component({\n  _ssrId: '${ssrId}',`
-            // );
-
-            // NOTE: Remove any commented code inside of render() so it doesn't get rendered during SSR
-            // or in the browser.
-            contents = contents.replace(JOYSTICK_COMMENT_REGEX, "");
-
-            const exportDefaultMatchParts =
-              (exportDefaultMatch && exportDefaultMatch.split(" ")) || [];
-            const componentName = exportDefaultMatchParts.pop();
-
-            if (componentName && isLayoutComponent) {
-              contents = contents.replace(
-                `${exportDefaultMatch};`,
-                `if (
-                  typeof window !== 'undefined' &&
-                  window.__joystick_ssr__ === true &&
-                  window.__joystick_layout_page__ &&
-                  ui &&
-                  ui.mount
-                ) {
-                  (async () => {
-                    const layoutComponentFile = await import(window.__joystick_layout__);
-                    const pageComponentFile = await import(window.window.__joystick_layout_page_url__);
-                    const layout = layoutComponentFile.default;
-                    const page = pageComponentFile.default;
-                    ui.mount(layout, Object.assign({ ...window.__joystick_ssr_props__ }, { page }), document.getElementById('app'));
-                  })();
-                }
-
-              export default ${componentName};
-                `
-              );
-            }
-
-            if (componentName && isPageComponent) {
-              contents = contents.replace(
-                `${exportDefaultMatch};`,
-                `if (
-                  typeof window !== 'undefined' &&
-                  window.__joystick_ssr__ === true &&
-                  !window.__joystick_layout_page__ &&
-                  ui &&
-                  ui.mount
-                ) {
-                  ui.mount(${componentName}, window.__joystick_ssr_props__ || {}, document.getElementById('app'));
-                }
-
-                export default ${componentName};
-                `
-              );
-            }
-
-            return {
-              contents,
-              loader: "js",
-            };
-          }
-        } catch (exception) {
-          console.warn(exception);
-        }
-      });
-
-      build.onEnd(() => {
-        return new Promise((resolve) => {
-          for (let i = 0; i < build?.initialOptions?.entryPoints?.length; i += 1) {
-            const entryPoint = build?.initialOptions?.entryPoints[i];
-            const shouldSetComponentId = [
-              getPlatformSafePath("ui/"),
-              getPlatformSafePath("email/"),
-            ].some((bootstrapTarget) => {
-              return entryPoint.includes(bootstrapTarget);
-            });
-
-            if (shouldSetComponentId) {
-              const file = fs.readFileSync(`${build?.initialOptions?.outdir}/${entryPoint}`, "utf-8");
-              const joystickUIMatches =
-              file?.match(JOYSTICK_COMPONENT_REGEX) || [];
-
-              if (joystickUIMatches?.length > 0) {
-                let contents = setComponentId(file)?.replace(
-                  /\.component\(\/\*\*\//g,
-                  ".component("
-                );
-                
-                fs.writeFileSync(`${build?.initialOptions?.outdir}/${entryPoint}`, contents);
-              }
-            } 
-          }
-
-          resolve();
-        });
-      });
-      },
-  },
-  generateFileDependencyMap: {
-    name: "generateFileDependencyMap",
-    setup(build) {
-      build.onLoad({ filter: /\.js$/ }, (args) => {
-        try {
-          const canAddToMap = ![
-            "node_modules",
-            ".joystick",
-            "?",
-            "commonjsHelpers.js",
-            ].some((excludedPath) => {
-              return getPlatformSafePath(args.path).includes(excludedPath);
-            });
-
-          if (canAddToMap) {
-            const code = fs.readFileSync(
-              getPlatformSafePath(args.path),
-              "utf-8"
-              );
-            updateFileMap(getPlatformSafePath(args.path), code);
-          }
-        } catch (exception) {
-          console.warn(exception);
-        }
-      });
-      },
-  },
-  warnNodeEnvironment: {
-    name: "warnNodeEnvironment",
-    setup(build) {
-      build.onLoad({ filter: /\.js$/ }, (args = {}) => {
-        const code = fs.readFileSync(args.path, "utf-8");
-
-        if (code?.match(/process.env.NODE_ENV\s+=\s/gi)?.length) {
-          console.warn(
-            chalk.yellowBright(
-              "\n[WARNING] process.env.NODE_ENV should only be set via a CLI flag in development or via external environment variables in production.\n"
-              )
-              );
-        }
-      });
-      },
-  },
-};

package/src/lib/build/getCodeFrame.js

@@ -1,7 +0,0 @@
-import fs from 'fs';
-import { codeFrameColumns } from "@babel/code-frame";
-
-export default (path = "", location = {}) => {
-  const file = fs.readFileSync(path, "utf-8");
-  return codeFrameColumns(file, { start: location });
-};

package/src/lib/build/minifyFile.js

@@ -1,10 +0,0 @@
-import fs from "fs";
-import esbuild from "esbuild";
-
-export default async (path = "") => {
-  if (fs.existsSync(path)) {
-    const file = fs.readFileSync(path, "utf-8");
-    const minified = await esbuild.transform(file, { minify: true });
-    fs.writeFileSync(path, minified.code);
-  }
-};

package/src/lib/build/nodePathExclusions.js

@@ -1,5 +0,0 @@
-import getPlatformSafePath from "../getPlatformSafePath.js";
-
-export default [
-  getPlatformSafePath("lib/browser")
-];

package/src/lib/build/nodePaths.js

@@ -1,9 +0,0 @@
-import getPlatformSafePath from "../getPlatformSafePath.js";
-
-export default [
-  getPlatformSafePath("api/"),
-  getPlatformSafePath("routes/"),
-  getPlatformSafePath("fixtures/"),
-  getPlatformSafePath("lib/node"),
-  "index.server.js",
-];

package/src/lib/build/onWarn.js

@@ -1,68 +0,0 @@
-import chalk from "chalk";
-import { OBJECT_REGEX } from "../regexes.js";
-import rainbowRoad from '../rainbowRoad.js';
-import getCodeFrame from "./getCodeFrame.js";
-
-const removeLocationDataFromStackTrace = (stackTrace = "") => {
-  return stackTrace.replace(OBJECT_REGEX, "");
-};
-
-const logError = (warning = {}) => {
-  const snippetParts = warning?.snippet?.split(`\n`);
-
-  console.log('\n');
-  console.log(`${rainbowRoad()}\n`);
-
-  if (warning.file) {
-    console.log(chalk.yellowBright(`Build Error in ${warning?.file}:\n`));
-  }
-
-  if (snippetParts && snippetParts.length > 0) {
-    snippetParts.forEach((line) => {
-      if (line.includes(`> ${warning.line} |`)) {
-        return console.log(`   ${chalk.red(line)}`);
-      }
-
-      return console.log(`   ${chalk.gray(line)}`);
-    });
-  }
-
-  if (warning?.stack) {
-    console.log(chalk.magentaBright("\nStack Trace:\n"));
-    console.log(chalk.yellow(`   ${removeLocationDataFromStackTrace(warning?.stack)}\n`));
-  }
-
-  process.loader.error(
-    "Build error. Fix the error above to continue building your app."
-    );
-  console.log('\n');
-  console.log(`${rainbowRoad()}\n`);
-};
-
-const parseWarning = (warning = {}, type = "") => {
-  if (type && type === "BUILD_ERROR") {
-    return {
-      file: warning?.file,
-      snippet: warning?.snippet || getCodeFrame(warning.file, {
-        line: warning?.line,
-        column: warning?.column,
-      }),
-      stack: warning?.stack,
-      line: warning?.line,
-      character: warning?.column,
-      message: warning?.message,
-    };
-  }
-
-  return null;
-};
-
-export default (warning) => {
-  const parsedWarning = parseWarning(warning, "BUILD_ERROR");
-
-  if (parsedWarning) {
-    logError(parsedWarning);
-  }
-
-  return parsedWarning;
-};

package/src/lib/build/removeDeletedDependenciesFromMap.js

@@ -1,19 +0,0 @@
-import fs from 'fs';
-import readFileDependencyMap from "../dev/readFileDependencyMap.js";
-
-export default (deletedDependencies = []) => {
-  const fileDependencyMap = readFileDependencyMap();
-
-  deletedDependencies.forEach((dependency) => {
-    const match = Object.keys(fileDependencyMap).find((key) => key.includes(dependency));
-
-    if (match) {
-      delete fileDependencyMap[match];
-    }
-  });
-
-  fs.writeFileSync(
-    `.joystick/build/fileMap.json`,
-    JSON.stringify(fileDependencyMap, null, 2)
-  );
-};

package/src/lib/build/setComponentId.js

@@ -1,58 +0,0 @@
-import fs from "fs";
-import generateId from "../generateId.js";
-
-export default (file = "") => {
-  const componentMapPath =
-    process.env.NODE_ENV === "development"
-      ? `./.joystick/build/componentMap.json`
-      : `./.build/componentMap.json`;
-  const componentMapExists = fs.existsSync(componentMapPath);
-  const componentMap = componentMapExists
-    ? JSON.parse(fs.readFileSync(componentMapPath, "utf-8"))
-    : {};
-
-  const parts = [...file?.matchAll(/\/\/ ui+.*/gi)]?.map((match) => {
-    return {
-      path: match[0],
-      index: match.index,
-    };
-  });
-
-  const components = (parts || [])?.map((part, partIndex) => {
-    const nextPart = parts[partIndex + 1];
-
-    return {
-      path: part.path.replace("// ", ""),
-      index: part.index,
-      source: file.substring(
-        part.index,
-        nextPart ? nextPart.index : file.length
-        ),
-    };
-  });
-
-  for (let i = 0; i < components.length; i += 1) {
-    const component = components[i];
-    const componentId =
-      (componentMap && componentMap[component.path]) || generateId();
-
-    if (componentMap) {
-      componentMap[component.path] = componentId;
-    }
-
-    const tainted = component.source.replace(
-      /\.component\(\{+(?!\n + _componentId)/g,
-      () => {
-        return `.component({\n  _componentId: '${componentId}',`;
-      }
-      );
-
-    file = file.replace(component.source, tainted);
-  }
-
-  if (componentMap) {
-    fs.writeFileSync(componentMapPath, JSON.stringify(componentMap));
-  }
-
-  return file;
-};