initializeApp() without arguments on App Hosting - not working locally

[Alan deLespinasse]

According to this page, with Firebase App Hosting you can now call initializeApp() in frontend code, and it will automatically use the right values. I just tried this in production, and it works.

But this section says it should also work in a local dev environment, if you set the environment variable FIREBASE_WEBAPP_CONFIG while running npm install firebase. I tried this and it didn't seem to work. I don't see how it could work, since that command doesn't appear to have altered any files, or saved any information, except for updating package.json and package-lock.json to have the latest version of the Firebase SDK. I thought maybe that meant I would need to set FIREBASE_WEBAPP_CONFIG when running the app locally, but that didn't seem to help either.

What am I missing? What exactly should happen when I install the firebase SDK package with FIREBASE_WEBAPP_CONFIG set?

This was an existing project, so it's possible that some kind of initialization had already been done that should have been done after installing the npm package. Very hard to tell from the documentation.

This isn't a huge problem for me, since I know how to configure Firebase the old way, but it would be nice to have a cleaner way.

I'm especially hoping that everything will Just Work with the emulator when running locally, rather than having to put conditionals in the client side code to manually tell it to use the emulator for everything.

[Alan deLespinasse]

Sorry, I should have included the error message:

Uncaught FirebaseError: Firebase: Need to provide options, when not being deployed to hosting via source. (app/no-options).
    at initializeApp (api.ts:160:25)
    at [project]/src/fb.ts [app-client] (ecmascript) (http://localhost:3000/_next/static/chunks/src_1fb170ce._.js:25:218)
    at dev-base.ts:205:21
    at runModuleExecutionHooks (dev-base.ts:265:5)
    at instantiateModule (dev-base.ts:203:5)
    at getOrInstantiateModuleFromParent (dev-base.ts:132:10)
    at esmImport (runtime-utils.ts:214:18)
    at [project]/src/app/FirebaseAuth.tsx [app-client] (ecmascript) (http://localhost:3000/_next/static/chunks/src_1fb170ce._.js:54:138)
    at dev-base.ts:205:21
    at runModuleExecutionHooks (dev-base.ts:265:5)
    at instantiateModule (dev-base.ts:203:5)
    at getOrInstantiateModuleFromParent (dev-base.ts:132:10)
    at commonJsRequire (runtime-utils.ts:241:18)
    at requireModule (react-server-dom-turbopack-client.browser.development.js:108:27)
    at initializeModuleChunk (react-server-dom-turbopack-client.browser.development.js:1051:21)
    at resolveModuleChunk (react-server-dom-turbopack-client.browser.development.js:1015:12)
    at react-server-dom-turbopack-client.browser.development.js:1609:20
    at RootLayout (layout.tsx:30:9)