apphosting emulator startCommand doesn't work with Angular

[markgoho]

[REQUIRED] Environment info

firebase-tools: 14.0.1

Platform: Windows 11

[REQUIRED] Test case

I've got an angular application that I've successfully deployed to app hosting, but when I run the local emulator, there's no sign of it working.

[REQUIRED] Steps to reproduce

Initialized emulators and got this config:

    "apphosting": {
      "port": 5002,
      "rootDirectory": "./apps/<my-ssr-angular-app>"
    },

but when I run firebase emulators:start

I get

Error: Failed to auto-detect your project's start command. Consider manually setting the start command by setting `firebase.json#emulators.apphosting.startCommand`

There doesn't appear to be any documentation on what this startCommand should do. Build? Serve? (I've tried both and neither work)

There seems to also be a discrepancy between "autodetect start command" in emulators and what the apphosting deployment does which seems to be some magic of detecting the framework and building the application. Again, this worked without issue in the real deployment, I guess we're just missing some parity with how the emulators work.

[REQUIRED] Expected behavior

Initializing apphosting emulators should "just work" the same way remote apphosting "just works", OR better documentation should be provided on how local emulation of apphosting works so devs know what the startcommand should be and how it interacts with the apphosting.

[REQUIRED] Actual behavior

Nothing works, e.g. no startCommand provided (auto-detect), nx serve nx build

[aalej]

Hey @markgoho, thanks for the detailed report and for sharing your observations. It looks like the error message is being raised from

firebase-tools/src/emulator/apphosting/developmentServer.ts

Lines 35 to 44 in 6c7245f

	export async function detectStartCommand(rootDir: string) {
	try {
	const packageManager = await detectPackageManager(rootDir);
	return `${packageManager} run dev`;
	} catch (e) {
	throw new FirebaseError(
	"Failed to auto-detect your project's start command. Consider manually setting the start command by setting `firebase.json#emulators.apphosting.startCommand`",
	);
	}
	}

The error occurs in detectPackageManager when the package manager you're using is not npm, yarn, or pnpm

firebase-tools/src/emulator/apphosting/developmentServer.ts

Lines 19 to 33 in 6c7245f

	export async function detectPackageManager(rootdir: string): Promise<PackageManager> {
	if (await pathExists(join(rootdir, "pnpm-lock.yaml"))) {
	return "pnpm";
	}
	if (await pathExists(join(rootdir, "yarn.lock"))) {
	return "yarn";
	}
	if (await pathExists(join(rootdir, "package-lock.json"))) {
	return "npm";
	}
	throw new FirebaseError("Unsupported package manager");
	}

Could you let us know if you're using a different package manager?

There doesn't appear to be any documentation on what this startCommand should do. Build? Serve? (I've tried both and neither work)

Let me try to ask our engineering team to see if we could provide a clearer description of what the startCommand does in https://firebase.google.com/docs/app-hosting/emulate

[mathu97]

Adding a clarifying comment here, startCommand is the command that is used to start your local dev server. The App Hosting emulator at the moment just tries to run your package manager's dev command (currently only autodetects npm, pnpm, or yarn). When you provide the rootDirectory the emulator cds into that directory and runs the startCommand.

We don't support specialized monorepo tooling like nx in the emulator yet but I believe you should be able to get it working by modifying the rootDirectory and startCommand. I think setting rootDirectory to something like ./ and startCommand to nx serve <app-name> should work if your firebase.json is in the project's root directory.