feat(create-react-router): detect nub package manager (#15276)

* Detect nub package manager

* Detect nub in dev package manager helper

* Use package manager detector in create-react-router

* Mark nub support changes as minor

Author: brophdawg11

packages/create-react-router/.changes/minor.detect-nub-package-manager.md

@@ -0,0 +1 @@
+Detect nub as a supported package manager when creating new projects

packages/create-react-router/__tests__/create-react-router-test.ts

@@ -818,6 +818,39 @@ describe("create-react-router CLI", () => {
     process.env.npm_config_user_agent = originalUserAgent;
   });
 
+  it("recognizes when nub was used to run the command", async () => {
+    let originalUserAgent = process.env.npm_config_user_agent;
+    process.env.npm_config_user_agent =
+      "nub/0.1.0 npm/? node/v24.0.0 linux x64";
+
+    let projectDir = getProjectDir("nub-create-from-user-agent");
+
+    mockSpawnSuccess();
+
+    // Suppress terminal output
+    let stdoutMock = jest
+      .spyOn(process.stdout, "write")
+      .mockImplementation(() => true);
+
+    await createReactRouter([
+      projectDir,
+      "--template",
+      path.join(__dirname, "fixtures", "blank"),
+      "--no-git-init",
+      "--yes",
+      "--no-agent-skills",
+    ]);
+
+    stdoutMock.mockReset();
+
+    expect(mockedSpawn).toHaveBeenCalledWith(
+      "nub",
+      expect.arrayContaining(["install"]),
+      expect.anything(),
+    );
+    process.env.npm_config_user_agent = originalUserAgent;
+  });
+
   it("supports specifying the package manager, regardless of user agent", async () => {
     let originalUserAgent = process.env.npm_config_user_agent;
     process.env.npm_config_user_agent =

packages/create-react-router/index.ts

@@ -158,10 +158,7 @@ async function getContext(argv: string[]): Promise<Context> {
     showInstallOutput: getBooleanArg(values["show-install-output"]) ?? false,
     noMotion: getBooleanArg(values["no-motion"]),
     pkgManager: validatePackageManager(
-      getStringArg(values["package-manager"]) ??
-        // npm, pnpm, Yarn, Bun and Deno (v2.0.5+) set the user agent environment variable that can be used
-        // to determine which package manager ran the command.
-        (process.env.npm_config_user_agent ?? "npm").split("/")[0],
+      getStringArg(values["package-manager"]) ?? detectPackageManager() ?? "npm",
     ),
     projectName,
     prompt,
@@ -574,13 +571,36 @@ async function doneStep(ctx: Context) {
   await sleep(200);
 }
 
-const validPackageManagers = ["npm", "yarn", "pnpm", "bun", "deno"] as const;
+const validPackageManagers = ["npm", "yarn", "pnpm", "bun", "deno", "nub"] as const;
 type PackageManager = (typeof validPackageManagers)[number];
 
 function validatePackageManager(pkgManager: string): PackageManager {
   return validPackageManagers.find((name) => pkgManager === name) ?? "npm";
 }
 
+/**
+ * Determine which package manager the user prefers.
+ *
+ * npm, pnpm, Yarn, Bun, Deno, and nub set the user agent environment variable
+ * that can be used to determine which package manager ran the command.
+ */
+function detectPackageManager(): PackageManager | undefined {
+  let { npm_config_user_agent } = process.env;
+  if (!npm_config_user_agent) return undefined;
+  try {
+    let pkgManager = npm_config_user_agent.split("/")[0];
+    if (pkgManager === "npm") return "npm";
+    if (pkgManager === "pnpm") return "pnpm";
+    if (pkgManager === "yarn") return "yarn";
+    if (pkgManager === "bun") return "bun";
+    if (pkgManager === "deno") return "deno";
+    if (pkgManager === "nub") return "nub";
+    return undefined;
+  } catch {
+    return undefined;
+  }
+}
+
 async function installDependencies({
   pkgManager,
   cwd,

packages/react-router-dev/.changes/minor.detect-nub-package-manager.md

@@ -0,0 +1 @@
+Detect nub as a supported package manager when installing framework dependencies

packages/react-router-dev/__tests__/detect-package-manager-test.ts

@@ -0,0 +1,31 @@
+import { detectPackageManager } from "../cli/detectPackageManager";
+
+describe("detectPackageManager", () => {
+  let originalUserAgent = process.env.npm_config_user_agent;
+
+  afterEach(() => {
+    process.env.npm_config_user_agent = originalUserAgent;
+  });
+
+  it.each(["npm", "pnpm", "yarn", "bun", "nub"] as const)(
+    "detects %s from the user agent",
+    (packageManager) => {
+      process.env.npm_config_user_agent = `${packageManager}/1.0.0 npm/? node/v24.0.0 linux x64`;
+
+      expect(detectPackageManager()).toBe(packageManager);
+    },
+  );
+
+  it("returns undefined for unknown package managers", () => {
+    process.env.npm_config_user_agent =
+      "unknown/1.0.0 npm/? node/v24.0.0 linux x64";
+
+    expect(detectPackageManager()).toBeUndefined();
+  });
+
+  it("returns undefined without a user agent", () => {
+    process.env.npm_config_user_agent = undefined;
+
+    expect(detectPackageManager()).toBeUndefined();
+  });
+});

packages/react-router-dev/cli/detectPackageManager.ts

@@ -1,9 +1,9 @@
-type PackageManager = "npm" | "pnpm" | "yarn" | "bun";
+type PackageManager = "npm" | "pnpm" | "yarn" | "bun" | "nub";
 
 /**
  * Determine which package manager the user prefers.
  *
- * npm, pnpm and Yarn set the user agent environment variable
+ * npm, pnpm, Yarn, Bun, and nub set the user agent environment variable
  * that can be used to determine which package manager ran
  * the command.
  */
@@ -16,6 +16,7 @@ export const detectPackageManager = (): PackageManager | undefined => {
     if (pkgManager === "pnpm") return "pnpm";
     if (pkgManager === "yarn") return "yarn";
     if (pkgManager === "bun") return "bun";
+    if (pkgManager === "nub") return "nub";
     return undefined;
   } catch {
     return undefined;