@backstage/cli 0.28.0-next.1 → 0.28.0

package/dist/lib/bundler/config.cjs.js

@@ -0,0 +1,491 @@
+'use strict';
+
+var path = require('path');
+var chalk = require('chalk');
+var webpack$1 = require('webpack');
+var ESLintPlugin = require('eslint-webpack-plugin');
+var ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
+var HtmlWebpackPlugin = require('html-webpack-plugin');
+var webpack = require('@module-federation/enhanced/webpack');
+var LinkedPackageResolvePlugin = require('./LinkedPackageResolvePlugin.cjs.js');
+var ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
+var runScriptWebpackPlugin = require('run-script-webpack-plugin');
+var ReactRefreshPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
+var paths = require('../paths.cjs.js');
+var fs = require('fs-extra');
+var getPackages = require('@manypkg/get-packages');
+var cliCommon = require('@backstage/cli-common');
+var nodeExternals = require('webpack-node-externals');
+var optimization = require('./optimization.cjs.js');
+var pickBy = require('lodash/pickBy');
+var entryPoints = require('../entryPoints.cjs.js');
+var run = require('../run.cjs.js');
+var transforms = require('./transforms.cjs.js');
+var version = require('../version.cjs.js');
+var yn = require('yn');
+var hasReactDomClient = require('./hasReactDomClient.cjs.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var chalk__default = /*#__PURE__*/_interopDefaultCompat(chalk);
+var webpack__default = /*#__PURE__*/_interopDefaultCompat(webpack$1);
+var ESLintPlugin__default = /*#__PURE__*/_interopDefaultCompat(ESLintPlugin);
+var ForkTsCheckerWebpackPlugin__default = /*#__PURE__*/_interopDefaultCompat(ForkTsCheckerWebpackPlugin);
+var HtmlWebpackPlugin__default = /*#__PURE__*/_interopDefaultCompat(HtmlWebpackPlugin);
+var ModuleScopePlugin__default = /*#__PURE__*/_interopDefaultCompat(ModuleScopePlugin);
+var ReactRefreshPlugin__default = /*#__PURE__*/_interopDefaultCompat(ReactRefreshPlugin);
+var fs__default = /*#__PURE__*/_interopDefaultCompat(fs);
+var nodeExternals__default = /*#__PURE__*/_interopDefaultCompat(nodeExternals);
+var pickBy__default = /*#__PURE__*/_interopDefaultCompat(pickBy);
+var yn__default = /*#__PURE__*/_interopDefaultCompat(yn);
+
+const BUILD_CACHE_ENV_VAR = "BACKSTAGE_CLI_EXPERIMENTAL_BUILD_CACHE";
+function resolveBaseUrl(config, moduleFederation) {
+  const baseUrl = config.getOptionalString("app.baseUrl");
+  const defaultBaseUrl = moduleFederation?.mode === "remote" ? `http://localhost:${process.env.PORT ?? "3000"}` : "http://localhost:3000";
+  try {
+    return new URL(baseUrl ?? "/", defaultBaseUrl);
+  } catch (error) {
+    throw new Error(`Invalid app.baseUrl, ${error}`);
+  }
+}
+function resolveEndpoint(config, moduleFederation) {
+  const url = resolveBaseUrl(config, moduleFederation);
+  return {
+    host: config.getOptionalString("app.listen.host") ?? url.hostname,
+    port: config.getOptionalNumber("app.listen.port") ?? Number(url.port) ?? (url.protocol === "https:" ? 443 : 80)
+  };
+}
+async function readBuildInfo() {
+  const timestamp = Date.now();
+  let commit;
+  try {
+    commit = await run.runPlain("git", "rev-parse", "HEAD");
+  } catch (error) {
+  }
+  let gitVersion;
+  try {
+    gitVersion = await run.runPlain("git", "describe", "--always");
+  } catch (error) {
+  }
+  if (commit === void 0 || gitVersion === void 0) {
+    console.info(
+      "NOTE: Did not compute git version or commit hash, could not execute the git command line utility"
+    );
+  }
+  const { version: packageVersion } = await fs__default.default.readJson(
+    paths.paths.resolveTarget("package.json")
+  );
+  return {
+    cliVersion: version.version,
+    gitVersion: gitVersion ?? "unknown",
+    packageVersion,
+    timestamp,
+    commit: commit ?? "unknown"
+  };
+}
+async function createConfig(paths$1, options) {
+  const {
+    checksEnabled,
+    isDev,
+    frontendConfig,
+    moduleFederation,
+    publicSubPath = "",
+    rspack
+  } = options;
+  const { plugins, loaders } = transforms.transforms(options);
+  const { packages } = await getPackages.getPackages(paths.paths.targetDir);
+  const externalPkgs = packages.filter((p) => !cliCommon.isChildPath(paths$1.root, p.dir));
+  const validBaseUrl = resolveBaseUrl(frontendConfig, moduleFederation);
+  let publicPath = validBaseUrl.pathname.replace(/\/$/, "");
+  if (publicSubPath) {
+    publicPath = `${publicPath}${publicSubPath}`.replace("//", "/");
+  }
+  if (isDev) {
+    const { host, port } = resolveEndpoint(
+      options.frontendConfig,
+      options.moduleFederation
+    );
+    if (rspack) {
+      const RspackReactRefreshPlugin = require("@rspack/plugin-react-refresh");
+      plugins.push(new RspackReactRefreshPlugin());
+    } else {
+      plugins.push(
+        new ReactRefreshPlugin__default.default({
+          overlay: {
+            sockProtocol: "ws",
+            sockHost: host,
+            sockPort: port
+          }
+        })
+      );
+    }
+  }
+  if (checksEnabled) {
+    plugins.push(
+      new ForkTsCheckerWebpackPlugin__default.default({
+        typescript: { configFile: paths$1.targetTsConfig, memoryLimit: 4096 }
+      }),
+      new ESLintPlugin__default.default({
+        context: paths$1.targetPath,
+        files: ["**/*.(ts|tsx|mts|cts|js|jsx|mjs|cjs)"]
+      })
+    );
+  }
+  const bundler = rspack ? rspack : webpack__default.default;
+  plugins.push(
+    new bundler.ProvidePlugin({
+      process: require.resolve("process/browser"),
+      Buffer: ["buffer", "Buffer"]
+    })
+  );
+  if (options.moduleFederation?.mode !== "remote") {
+    plugins.push(
+      // `rspack.HtmlRspackPlugin` does not support object type `templateParameters` value, `frontendConfig` in this case
+      new HtmlWebpackPlugin__default.default({
+        meta: {
+          "backstage-app-mode": options?.appMode ?? "public"
+        },
+        template: paths$1.targetHtml,
+        templateParameters: {
+          publicPath,
+          config: frontendConfig
+        }
+      })
+    );
+    plugins.push(
+      new HtmlWebpackPlugin__default.default({
+        meta: {
+          "backstage-app-mode": options?.appMode ?? "public",
+          // This is added to be written in the later step, and finally read by the extra entry point
+          "backstage-public-path": "<%= publicPath %>/"
+        },
+        minify: false,
+        publicPath: "<%= publicPath %>",
+        filename: "index.html.tmpl",
+        template: `raw-loader!${paths$1.targetHtml}`
+      })
+    );
+  }
+  if (options.moduleFederation) {
+    const isRemote = options.moduleFederation?.mode === "remote";
+    const AdaptedModuleFederationPlugin = rspack ? rspack.container.ModuleFederationPlugin : webpack.ModuleFederationPlugin;
+    plugins.push(
+      new AdaptedModuleFederationPlugin({
+        ...isRemote && {
+          filename: "remoteEntry.js",
+          exposes: {
+            ".": paths$1.targetEntry
+          }
+        },
+        name: options.moduleFederation.name,
+        runtime: false,
+        shared: {
+          // React
+          react: {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          },
+          "react-dom": {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          },
+          // React Router
+          "react-router": {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          },
+          "react-router-dom": {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          },
+          // MUI v4
+          "@material-ui/core/styles": {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          },
+          "@material-ui/styles": {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          },
+          // MUI v5
+          "@mui/material/styles/": {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          },
+          "@emotion/react": {
+            singleton: true,
+            requiredVersion: "*",
+            eager: !isRemote
+          }
+        }
+      })
+    );
+  }
+  const buildInfo = await readBuildInfo();
+  plugins.push(
+    new bundler.DefinePlugin({
+      "process.env.BUILD_INFO": JSON.stringify(buildInfo),
+      "process.env.APP_CONFIG": rspack ? (
+        // FIXME: see also https://github.com/web-infra-dev/rspack/issues/5606
+        JSON.stringify(options.getFrontendAppConfigs())
+      ) : bundler.DefinePlugin.runtimeValue(
+        () => JSON.stringify(options.getFrontendAppConfigs()),
+        true
+      ),
+      // This allows for conditional imports of react-dom/client, since there's no way
+      // to check for presence of it in source code without module resolution errors.
+      "process.env.HAS_REACT_DOM_CLIENT": JSON.stringify(hasReactDomClient.hasReactDomClient())
+    })
+  );
+  const reactRefreshFiles = rspack ? [] : [
+    require.resolve(
+      "@pmmmwh/react-refresh-webpack-plugin/lib/runtime/RefreshUtils.js"
+    ),
+    require.resolve(
+      "@pmmmwh/react-refresh-webpack-plugin/overlay/index.js"
+    ),
+    require.resolve("react-refresh")
+  ];
+  const mode = isDev ? "development" : "production";
+  const optimization$1 = optimization.optimization(options);
+  if (mode === "production" && process.env.EXPERIMENTAL_MODULE_FEDERATION && process.env.FORCE_REACT_DEVELOPMENT) {
+    console.log(
+      chalk__default.default.yellow(
+        `\u26A0\uFE0F  WARNING: Forcing react and react-dom into development mode. This build should not be used in production.`
+      )
+    );
+    const reactPackageDirs = [
+      `${path.dirname(require.resolve("react/package.json"))}/`,
+      `${path.dirname(require.resolve("react-dom/package.json"))}/`
+    ];
+    optimization$1.nodeEnv = false;
+    plugins.push(
+      new bundler.DefinePlugin({
+        "process.env.NODE_ENV": rspack ? (
+          // FIXME: see also https://github.com/web-infra-dev/rspack/issues/5606
+          JSON.stringify(mode)
+        ) : webpack__default.default.DefinePlugin.runtimeValue(({ module }) => {
+          if (reactPackageDirs.some((val) => module.resource.startsWith(val))) {
+            return '"development"';
+          }
+          return `"${mode}"`;
+        })
+      })
+    );
+  }
+  const withCache = yn__default.default(process.env[BUILD_CACHE_ENV_VAR], { default: false });
+  return {
+    mode,
+    profile: false,
+    ...isDev ? {
+      watchOptions: {
+        ignored: /node_modules/
+      }
+    } : {},
+    optimization: optimization$1,
+    bail: false,
+    performance: {
+      hints: false
+      // we check the gzip size instead
+    },
+    devtool: isDev ? "eval-cheap-module-source-map" : "source-map",
+    context: paths$1.targetPath,
+    entry: [
+      require.resolve("@backstage/cli/config/webpack-public-path"),
+      ...options.additionalEntryPoints ?? [],
+      paths$1.targetEntry
+    ],
+    resolve: {
+      extensions: [".ts", ".tsx", ".mjs", ".js", ".jsx", ".json", ".wasm"],
+      mainFields: ["browser", "module", "main"],
+      fallback: {
+        ...pickBy__default.default(require("node-libs-browser")),
+        module: false,
+        dgram: false,
+        dns: false,
+        fs: false,
+        http2: false,
+        net: false,
+        tls: false,
+        child_process: false,
+        /* new ignores */
+        path: false,
+        https: false,
+        http: false,
+        util: require.resolve("util/")
+      },
+      // FIXME: see also https://github.com/web-infra-dev/rspack/issues/3408
+      ...!rspack && {
+        plugins: [
+          new LinkedPackageResolvePlugin.LinkedPackageResolvePlugin(paths$1.rootNodeModules, externalPkgs),
+          new ModuleScopePlugin__default.default(
+            [paths$1.targetSrc, paths$1.targetDev],
+            [paths$1.targetPackageJson, ...reactRefreshFiles]
+          )
+        ]
+      }
+    },
+    module: {
+      rules: loaders
+    },
+    output: {
+      uniqueName: options.moduleFederation?.name,
+      path: paths$1.targetDist,
+      publicPath: options.moduleFederation?.mode === "remote" ? "auto" : `${publicPath}/`,
+      filename: isDev ? "[name].js" : "static/[name].[fullhash:8].js",
+      chunkFilename: isDev ? "[name].chunk.js" : "static/[name].[chunkhash:8].chunk.js",
+      ...isDev ? {
+        devtoolModuleFilenameTemplate: (info) => `file:///${path.resolve(info.absoluteResourcePath).replace(
+          /\\/g,
+          "/"
+        )}`
+      } : {}
+    },
+    experiments: {
+      lazyCompilation: !rspack && yn__default.default(process.env.EXPERIMENTAL_LAZY_COMPILATION),
+      ...rspack && {
+        // We're still using `style-loader` for custom `insert` option
+        css: false
+      }
+    },
+    plugins,
+    ...withCache && {
+      cache: {
+        type: "filesystem",
+        buildDependencies: {
+          config: [__filename]
+        }
+      }
+    }
+  };
+}
+async function createBackendConfig(paths$1, options) {
+  const { checksEnabled, isDev } = options;
+  const { packages } = await getPackages.getPackages(paths.paths.targetDir);
+  const localPackageEntryPoints = packages.flatMap((p) => {
+    const entryPoints$1 = entryPoints.readEntryPoints(p.packageJson);
+    return entryPoints$1.map((e) => path.posix.join(p.packageJson.name, e.mount));
+  });
+  const moduleDirs = packages.map((p) => path.resolve(p.dir, "node_modules"));
+  const externalPkgs = packages.filter((p) => !cliCommon.isChildPath(paths$1.root, p.dir));
+  const { loaders } = transforms.transforms({ ...options, isBackend: true });
+  const runScriptNodeArgs = new Array();
+  if (options.inspectEnabled) {
+    const inspect = typeof options.inspectEnabled === "string" ? `--inspect=${options.inspectEnabled}` : "--inspect";
+    runScriptNodeArgs.push(inspect);
+  } else if (options.inspectBrkEnabled) {
+    const inspect = typeof options.inspectBrkEnabled === "string" ? `--inspect-brk=${options.inspectBrkEnabled}` : "--inspect-brk";
+    runScriptNodeArgs.push(inspect);
+  }
+  if (options.require) {
+    runScriptNodeArgs.push(`--require=${options.require}`);
+  }
+  return {
+    mode: isDev ? "development" : "production",
+    profile: false,
+    ...isDev ? {
+      watch: true,
+      watchOptions: {
+        ignored: /node_modules\/(?!\@backstage)/
+      }
+    } : {},
+    externals: [
+      nodeExternalsWithResolve({
+        modulesDir: paths$1.rootNodeModules,
+        additionalModuleDirs: moduleDirs,
+        allowlist: ["webpack/hot/poll?100", ...localPackageEntryPoints]
+      })
+    ],
+    target: "node",
+    node: {
+      /* eslint-disable-next-line no-restricted-syntax */
+      __dirname: true,
+      __filename: true,
+      global: true
+    },
+    bail: false,
+    performance: {
+      hints: false
+      // we check the gzip size instead
+    },
+    devtool: isDev ? "eval-cheap-module-source-map" : "source-map",
+    context: paths$1.targetPath,
+    entry: [
+      "webpack/hot/poll?100",
+      paths$1.targetRunFile ? paths$1.targetRunFile : paths$1.targetEntry
+    ],
+    resolve: {
+      extensions: [".ts", ".mjs", ".js", ".json"],
+      mainFields: ["main"],
+      modules: [paths$1.rootNodeModules, ...moduleDirs],
+      plugins: [
+        new LinkedPackageResolvePlugin.LinkedPackageResolvePlugin(paths$1.rootNodeModules, externalPkgs),
+        new ModuleScopePlugin__default.default(
+          [paths$1.targetSrc, paths$1.targetDev],
+          [paths$1.targetPackageJson]
+        )
+      ]
+    },
+    module: {
+      rules: loaders
+    },
+    output: {
+      path: paths$1.targetDist,
+      filename: isDev ? "[name].js" : "[name].[hash:8].js",
+      chunkFilename: isDev ? "[name].chunk.js" : "[name].[chunkhash:8].chunk.js",
+      ...isDev ? {
+        devtoolModuleFilenameTemplate: (info) => `file:///${path.resolve(info.absoluteResourcePath).replace(
+          /\\/g,
+          "/"
+        )}`
+      } : {}
+    },
+    plugins: [
+      new runScriptWebpackPlugin.RunScriptWebpackPlugin({
+        name: "main.js",
+        nodeArgs: runScriptNodeArgs.length > 0 ? runScriptNodeArgs : void 0,
+        args: process.argv.slice(3)
+        // drop `node backstage-cli backend:dev`
+      }),
+      new webpack__default.default.HotModuleReplacementPlugin(),
+      ...checksEnabled ? [
+        new ForkTsCheckerWebpackPlugin__default.default({
+          typescript: { configFile: paths$1.targetTsConfig }
+        }),
+        new ESLintPlugin__default.default({
+          files: ["**/*.(ts|tsx|mts|cts|js|jsx|mjs|cjs)"]
+        })
+      ] : []
+    ]
+  };
+}
+function nodeExternalsWithResolve(options) {
+  let currentContext;
+  const externals = nodeExternals__default.default({
+    ...options,
+    importType(request) {
+      const resolved = require.resolve(request, {
+        paths: [currentContext]
+      });
+      return `commonjs ${resolved}`;
+    }
+  });
+  return ({ context, request }, callback) => {
+    currentContext = context;
+    return externals(context, request, callback);
+  };
+}
+
+exports.createBackendConfig = createBackendConfig;
+exports.createConfig = createConfig;
+exports.resolveBaseUrl = resolveBaseUrl;
+exports.resolveEndpoint = resolveEndpoint;
+//# sourceMappingURL=config.cjs.js.map

package/dist/lib/bundler/hasReactDomClient.cjs.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var paths = require('../paths.cjs.js');
+
+function hasReactDomClient() {
+  try {
+    require.resolve("react-dom/client", {
+      paths: [paths.paths.targetDir]
+    });
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+exports.hasReactDomClient = hasReactDomClient;
+//# sourceMappingURL=hasReactDomClient.cjs.js.map

package/dist/lib/bundler/moduleFederation.cjs.js

@@ -0,0 +1,28 @@
+'use strict';
+
+var chalk = require('chalk');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var chalk__default = /*#__PURE__*/_interopDefaultCompat(chalk);
+
+function getModuleFederationOptions(name, isModuleFederationRemote) {
+  if (!isModuleFederationRemote && !process.env.EXPERIMENTAL_MODULE_FEDERATION) {
+    return void 0;
+  }
+  console.log(
+    chalk__default.default.yellow(
+      `\u26A0\uFE0F  WARNING: Module federation is experimental and will receive immediate breaking changes in the future.`
+    )
+  );
+  return {
+    mode: isModuleFederationRemote ? "remote" : "host",
+    // The default output mode requires the name to be a usable as a code
+    // symbol, there might be better options here but for now we need to
+    // sanitize the name.
+    name: name.replaceAll("@", "").replaceAll("/", "__").replaceAll("-", "_")
+  };
+}
+
+exports.getModuleFederationOptions = getModuleFederationOptions;
+//# sourceMappingURL=moduleFederation.cjs.js.map

package/dist/lib/bundler/optimization.cjs.js

@@ -0,0 +1,67 @@
+'use strict';
+
+const { EsbuildPlugin } = require("esbuild-loader");
+const optimization = (options) => {
+  const { isDev, rspack } = options;
+  const MinifyPlugin = rspack ? rspack.SwcJsMinimizerRspackPlugin : EsbuildPlugin;
+  return {
+    minimize: !isDev,
+    minimizer: [
+      new MinifyPlugin({
+        target: "ES2022",
+        format: "iife",
+        exclude: "remoteEntry.js"
+      }),
+      // Avoid iife wrapping of module federation remote entry as it breaks the variable assignment
+      new MinifyPlugin({
+        target: "ES2022",
+        format: void 0,
+        include: "remoteEntry.js"
+      }),
+      rspack && new rspack.LightningCssMinimizerRspackPlugin()
+    ],
+    runtimeChunk: "single",
+    splitChunks: {
+      automaticNameDelimiter: "-",
+      cacheGroups: {
+        default: false,
+        // Put all vendor code needed for initial page load in individual files if they're big
+        // enough, if they're smaller they end up in the main
+        packages: {
+          chunks: "initial",
+          test(module) {
+            return Boolean(
+              module?.resource?.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)
+            );
+          },
+          name(module) {
+            const packageName = module.resource.match(
+              /[\\/]node_modules[\\/](.*?)([\\/]|$)/
+            )[1];
+            return packageName.replace("@", "");
+          },
+          filename: isDev ? "module-[name].js" : "static/module-[name].[chunkhash:8].js",
+          priority: 10,
+          minSize: 1e5,
+          minChunks: 1,
+          ...!rspack && {
+            maxAsyncRequests: Infinity,
+            maxInitialRequests: Infinity
+          }
+        },
+        // filename is not included in type, but we need it
+        // Group together the smallest modules
+        vendor: {
+          chunks: "initial",
+          test: /[\\/]node_modules[\\/]/,
+          name: "vendor",
+          priority: 5,
+          enforce: true
+        }
+      }
+    }
+  };
+};
+
+exports.optimization = optimization;
+//# sourceMappingURL=optimization.cjs.js.map