react-native-bundle-discovery-ui 2.6.0 → 2.7.0-rc.0

package/.discoveryrc.js

@@ -1,22 +0,0 @@
-const path = require("path");
-
-module.exports = {
-  name: "react-native-bundle-discovery",
-  data: () => require("./tmp/metro-stats.json"),
-  setup: path.resolve(__dirname, "setup.js"),
-  view: {
-    assets: [
-      // Global styles
-      path.resolve(__dirname, "views/global.css"),
-      // Pages
-      path.resolve(__dirname, "pages/default.js"),
-      path.resolve(__dirname, "pages/module.js"),
-      path.resolve(__dirname, "pages/package.js"),
-      // Custom views
-      path.resolve(__dirname, "views/highcharts.css"),
-      path.resolve(__dirname, "views/prettify.js"),
-      path.resolve(__dirname, "views/highcharts.js"),
-      path.resolve(__dirname, "views/foamtree.js"),
-    ],
-  },
-};

package/lib/bin.js

@@ -1,94 +0,0 @@
-#!/usr/bin/env node
-const minimist = require("minimist");
-
-function printHelp() {
-  console.log(`react-native-bundle-discovery-ui
-
-Usage:
-  react-native-bundle-discovery-ui <file> [port] [--verbose] # <- server can be omitted
-  react-native-bundle-discovery-ui server <file> [port] [--verbose]
-
-  react-native-bundle-discovery-ui build <file> [--output <path>] [--clean] [--single-file] [--verbose]
-
-Commands:
-  server <file> [port]  Run a web server to show a Metro bundler stat report
-  build <file>          Build a HTML report from the Metro bundler stat file
-
-Options:
-  -v, --verbose          Run with verbose logging
-  -o, --output <path>    Path for a build result (default: .bundle-discovery)
-  -c, --clean            Clean output directory before writing build files (default: true)
-  -s, --single-file      Output report build as a single HTML file (default: true)
-  -p, --port <port>      Port for server command (same as [port], default: 8079)
-  -h, --help             Show help
-`);
-}
-
-function fail(message) {
-  console.error(message);
-  console.error("Use --help to see usage.");
-  process.exit(1);
-}
-
-const argv = minimist(process.argv.slice(2), {
-  alias: {
-    v: "verbose",
-    h: "help",
-    o: "output",
-    c: "clean",
-    s: "single-file",
-    p: "port",
-  },
-  boolean: ["verbose", "help", "clean", "single-file"],
-  string: ["output"],
-  default: {
-    clean: true,
-    "single-file": true,
-  },
-});
-
-const command = argv._[0];
-const isServerCommand = command === "server";
-const isBuildCommand = command === "build";
-const isImplicitServerCommand =
-  Boolean(command) && !isServerCommand && !isBuildCommand;
-
-if (argv.help || !command) {
-  printHelp();
-  process.exit(0);
-}
-
-if (isServerCommand || isImplicitServerCommand) {
-  const file = isImplicitServerCommand ? argv._[0] : argv._[1];
-  if (!file) {
-    fail("Missing required argument: <file>");
-  }
-
-  const rawPort =
-    argv.port ?? (isImplicitServerCommand ? argv._[1] : argv._[2]) ?? 8079;
-  const port = Number(rawPort);
-  if (!Number.isFinite(port)) {
-    fail(`Invalid port: ${rawPort}`);
-  }
-
-  const { serve } = require("./server.js");
-  return serve(file, port, Boolean(argv.verbose));
-}
-
-if (isBuildCommand) {
-  const file = argv._[1];
-  if (!file) {
-    fail("Missing required argument: <file>");
-  }
-
-  const { buildHtmlPage } = require("./build.js");
-  return buildHtmlPage(
-    file,
-    argv.output,
-    argv.clean,
-    argv["single-file"],
-    Boolean(argv.verbose),
-  );
-}
-
-fail(`Unknown command: ${command}`);

package/lib/build.js

@@ -1,123 +0,0 @@
-const fs = require("fs");
-const path = require("path");
-const chalk = require("chalk");
-const { build } = require("@discoveryjs/cli");
-const config = require("../.discoveryrc.js");
-const { isRsdoctorReportPath } = require("./isRsdoctorReport.js");
-
-function buildHtmlPage(filePath, output, clean, singleFile, verbose) {
-  if (verbose) {
-    console.info(
-      `Building HTML page from file: ${chalk.green(filePath)} options: ${JSON.stringify(
-        { output, clean, singleFile },
-        null,
-        2,
-      )}`,
-    );
-  }
-
-  if (!filePath) {
-    console.error(
-      `Usage: '${chalk.green("npx react-native-bundle-discovery build <path-to-file>")}', Please provide a path to a JSON file.`,
-    );
-    process.exit(1);
-  }
-
-  const jsonFilePath = path.resolve(process.cwd(), filePath);
-  if (verbose) {
-    console.info(
-      `Loading JSON file from: ${chalk.green(jsonFilePath)}, base directory: ${chalk.green(process.cwd())}`,
-    );
-  }
-
-  let fullJsonPath;
-
-  try {
-    fullJsonPath = require.resolve(jsonFilePath);
-  } catch (err) {
-    console.error(`❌Error loading file: ${chalk.red(jsonFilePath)}\n\n`);
-    console.error(err.message);
-    process.exit(1);
-  }
-
-  const configFile = path.resolve(__dirname, "./.tmp.js");
-
-  if (verbose) {
-    console.info(
-      `Creating temporary config file at: ${chalk.green(configFile)}, for discovery.js`,
-    );
-  }
-  const transformRcdoctor = require.resolve("./rsdoctor.js");
-  fs.writeFileSync(
-    configFile,
-    `const {transformRSDoctorData} = require("${transformRcdoctor}");
-module.exports = ${JSON.stringify(
-      { ...config, data: "<tmp>" },
-      null,
-      1,
-    ).replace(
-      `"<tmp>"`,
-      isRsdoctorReportPath(fullJsonPath)
-        ? `() => transformRSDoctorData(require("${fullJsonPath}"))`
-        : `() => require("${fullJsonPath}")`,
-    )};`,
-  );
-
-  if (verbose) {
-    console.info(`Building HTML page with options:`, {
-      output,
-      clean,
-      singleFile,
-    });
-  }
-
-  const _config = {
-    name: "Bundle Discovery",
-    mode: "single",
-    // models: [ [Object] ],
-    colorScheme: "auto",
-    download: true,
-    upload: false,
-    embed: false,
-    encodings: false,
-  };
-  const _options = {
-    singleFile,
-    clean,
-    output,
-    //
-    cache: true,
-    cachedir: path.resolve(__dirname, "./.discoveryjs-cache"),
-    checkCacheTtl: false,
-    minify: true,
-    dataCompression: true,
-    sourcemap: false,
-    embed: "by-config",
-    experimentalJsonxl: false,
-    scriptFormat: "esm",
-    scriptExternal: [],
-    data: true,
-    excludeModelOnDataFail: false,
-    prettyData: false,
-    modelDownload: false,
-    modelDataUpload: true,
-    modelResetCache: false,
-    serveOnlyAssets: true,
-    dev: true,
-    config: configFile,
-    configFile: configFile,
-  };
-  return build(_options, _config, configFile).then((result) => {
-    console.log(`========================================`);
-    console.log(
-      `✅ HTML page built successfully at: ${chalk.green(
-        path.resolve(output, "index.html").replace(process.cwd() + "/", ""),
-      )}`,
-    );
-    console.log(`========================================`);
-  });
-}
-
-module.exports = {
-  buildHtmlPage,
-};

package/lib/isRsdoctorReport.js

@@ -1,33 +0,0 @@
-const chalk = require("chalk");
-
-const isRsdoctorReportPath = (reportPath) => {
-  try {
-    const reportJson = require(reportPath);
-    return isRsdoctorReport(reportJson, reportPath);
-  } catch {
-    return false;
-  }
-};
-
-const isRsdoctorReport = (reportJson, reportPath, noLogs) => {
-  try {
-    if (
-      Array.isArray(reportJson?.data?.moduleGraph?.modules) ||
-      Array.isArray(reportJson?.data?.packageGraph?.packages)
-    ) {
-      !noLogs &&
-        console.info(
-          `Detected ${chalk.red("rsdoctor")} format in the input file: ${chalk.green(reportPath)}`,
-        );
-      return true;
-    }
-    return false;
-  } catch {
-    return false;
-  }
-};
-
-module.exports = {
-  isRsdoctorReport,
-  isRsdoctorReportPath,
-};

package/lib/rsdoctor.js

@@ -1,149 +0,0 @@
-const { resolve } = require("path");
-
-const possibleEntryFiles = [
-  "index.js",
-  "index.jsx",
-  "index.ts",
-  "index.tsx",
-  "index.mjs",
-  "index.cjs",
-];
-
-const doStructureCheck = (rsdoctorData) => {
-  if (!(
-    Array.isArray(rsdoctorData?.data?.configs) &&
-    rsdoctorData.data.configs.length === 1
-  )) {
-    throw new Error(
-      `Unexpected number of "data.configs[]" in rsdoctor-data.json. Work only with single config. Found: ${rsdoctorData?.data?.configs?.length}`,
-    );
-  }
-
-  if (!Array.isArray(rsdoctorData?.data?.packageGraph?.packages)) {
-    throw new Error(
-      `Unexpected "data.packageGraph.packages[]" in rsdoctor-data.json. Expected array. Found: ${typeof rsdoctorData?.data?.packageGraph?.packages}`,
-    );
-  }
-
-  const firstConfig = rsdoctorData.data.configs[0];
-
-  if (!(firstConfig.name === "rspack" || firstConfig.name === "webpack")) {
-    throw new Error(
-      `Unsupported bundler: ${firstConfig.name}@${firstConfig.version}. Only 'rspack' and 'webpack' are supported.`,
-    );
-  }
-};
-
-const getDependenciesMap = (rsdoctorData) => {
-  const depsMap = new Map(
-    rsdoctorData.data.moduleGraph.dependencies.map((dep) => [dep.id, dep]),
-  );
-  return depsMap;
-};
-
-const getEntryFile = (rsdoctorData) => {
-  const firstConfig = rsdoctorData?.data?.configs?.[0];
-  const entry = firstConfig?.config?.entry;
-  const entryFile =
-    typeof entry?.main === "string"
-      ? entry.main
-      : typeof entry?.main?.import === "string"
-        ? entry.main.import
-        : entry?.main.import[0];
-
-  if (entryFile) {
-    return resolve(firstConfig.root, entryFile);
-  }
-
-  const pathsToCheck = possibleEntryFiles.map((f) =>
-    resolve(firstConfig.root, f),
-  );
-  const indexFile = rsdoctorData.data.moduleGraph.modules.find((mdl) =>
-    pathsToCheck.some((entry) => mdl.path === entry),
-  );
-
-  if (indexFile && indexFile.imported?.length === 0) {
-    return indexFile.path;
-  }
-
-  return `${firstConfig.root}/index.js`;
-};
-
-const transformRSDoctorData = (rsdoctorData) => {
-  doStructureCheck(rsdoctorData);
-  const tmpDependenciesMap = getDependenciesMap(rsdoctorData);
-  const firstConfig = rsdoctorData.data.configs[0];
-  return {
-    date: Date.now(), // no info in rspack report
-    entryPoint: getEntryFile(rsdoctorData),
-    rootFolder: firstConfig.root,
-    // envs: {},
-    transformOptions: {
-      // customTransformOptions: {},
-      dev: firstConfig.config.mode !== "production",
-      minify: firstConfig.config.optimization?.minimize ?? false,
-      platform: firstConfig.config.name ?? "ios",
-      // type: "module",
-      // unstable_transformProfile: "default",
-    },
-    // Example of package:
-    // {
-    //   name: "@react-native/js-polyfills",
-    //   absolutePath:
-    //     "/Users/xd/tmp/RN84/node_modules/@react-native/js-polyfills",
-    //   version: "0.84.1",
-    // }
-    packages: rsdoctorData.data.packageGraph.packages.map((pkg) => ({
-      name: pkg.name,
-      absolutePath: pkg.root,
-      version: pkg.version,
-      source: { sizeInBytes: pkg.size?.sourceSize ?? 1 },
-      output: { sizeInBytes: pkg.size?.parsedSize ?? 1 },
-    })),
-    // Example of module:
-    // {
-    //   "path": "/Users/xd/tmp/RN84/node_modules/react-native/Libraries/BatchedBridge/BatchedBridge.js",
-    //   "source": {
-    //     "code": "",
-    //     "lineCount": 32,
-    //     "sizeInBytes": 954
-    //   },
-    //   "output": {
-    //     "code": "",
-    //     "lineCount": 1,
-    //     "sizeInBytes": 219
-    //   },
-    //   "dependencies": [
-    //     {
-    //       "absolutePath": "/Users/xd/tmp/RN84/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js",
-    //       "name": "./MessageQueue"
-    //     }
-    //   ]
-    // },
-    modules: rsdoctorData.data.moduleGraph.modules.map((mdl) => ({
-      path: mdl.path,
-      source: {
-        code: "", // no code in rspack report
-        lineCount: 0, // no code to count lines in rspack report
-        sizeInBytes: mdl.size?.sourceSize ?? 0,
-      },
-      output: {
-        code: "",
-        lineCount: 0,
-        sizeInBytes: mdl.size?.parsedSize ?? 0,
-      },
-      dependencies: mdl.dependencies
-        .map((depNumId) => {
-          const dep = tmpDependenciesMap.get(depNumId);
-          return dep
-            ? { absolutePath: dep.resolvedRequest, name: dep.request }
-            : null;
-        })
-        .filter((e) => e !== null),
-    })),
-  };
-};
-
-module.exports = {
-  transformRSDoctorData,
-};

package/lib/server.js

@@ -1,90 +0,0 @@
-const fs = require("fs");
-const path = require("path");
-const chalk = require("chalk");
-const { createServer } = require("@discoveryjs/cli");
-const { silent } = require("@discoveryjs/cli/lib/shared/utils.js");
-const config = require("../.discoveryrc.js");
-const { isRsdoctorReportPath } = require("./isRsdoctorReport.js");
-
-function serve(filePath, port, verbose) {
-  const PORT = process.env.PORT || port;
-
-  if (verbose) {
-    console.info(
-      `start server with file: ${filePath} on port: ${port} ${process.env.PORT ? `(${chalk.yellow("PORT")} env)` : ""}`,
-    );
-  }
-
-  if (!filePath) {
-    console.error(
-      `Usage: '${chalk.green("npx react-native-bundle-discovery server <path-to-file>")}', Please provide a path to a JSON file.`,
-    );
-    process.exit(1);
-  }
-
-  const jsonFilePath = path.resolve(process.cwd(), filePath);
-  if (verbose) {
-    console.info(
-      `Loading JSON file from: ${chalk.green(jsonFilePath)}, base directory: ${chalk.green(process.cwd())}`,
-    );
-  }
-
-  let fullJsonPath;
-
-  try {
-    fullJsonPath = require.resolve(jsonFilePath);
-  } catch (err) {
-    console.error(`❌Error loading file: ${chalk.red(jsonFilePath)}\n\n`);
-    console.error(err.message);
-    process.exit(1);
-  }
-
-  const configFile = path.resolve(__dirname, "./.tmp.js");
-
-  if (verbose) {
-    console.info(
-      `Creating temporary config file at: ${chalk.green(configFile)}, for discovery.js`,
-    );
-  }
-  const transformRcdoctor = require.resolve("./rsdoctor.js");
-  fs.writeFileSync(
-    configFile,
-    `const {transformRSDoctorData} = require("${transformRcdoctor}");
-module.exports = ${JSON.stringify(
-      { ...config, data: "<tmp>" },
-      null,
-      1,
-    ).replace(
-      `"<tmp>"`,
-      isRsdoctorReportPath(fullJsonPath)
-        ? `() => transformRSDoctorData(require("${fullJsonPath}"))`
-        : `() => require("${fullJsonPath}")`,
-    )};`,
-  );
-
-  if (verbose) {
-    console.info(`Running server with config: ${chalk.green(configFile)}`);
-  }
-
-  return silent(() =>
-    createServer({
-      cache: false,
-      minify: true,
-      dev: false,
-      config: configFile,
-      configFile,
-    }).then((server) =>
-      server.listen(PORT, () => {
-        console.log(
-          `[react-native-bundle-discovery]: 🚀 Server listen on ${chalk.green.underline(
-            chalk.green(`http://localhost:${PORT}`),
-          )}`,
-        );
-      }),
-    ),
-  );
-}
-
-module.exports = {
-  serve,
-};