Loading Firebase with '* as firebase' and 'firebaseui' via 'npm'

[akauppi]

Something is wrong with firebase npm packaging.

It is intended to be loaded as:

import * as firebase from 'firebase'
import 'firebase/auth'
...

If we do this, firebase.initializeApp is undefined and we don't get the app started, at all.

This works:

import firebase from 'firebase'    // NOT according to documentation
import 'firebase/auth'

This provides firebase.initializeApp and we get Firebase running. However, if we try to load Firebase UI via npm, this happens:

In browser console:

Uncaught (in promise) SyntaxError: The requested module '/@modules/dialog-polyfill/dialog-polyfill.js' does not provide an export named 'default'

Same symptoms as here (Jul 2019).

Steps to reproduce:

• clone branch pr-issue-7-firebaseui
• set up, according to README.md
• npm run dev

Expected:

You'd get a UI in localhost://3000/signin

Actual:

Empty screen and in browser console:

Uncaught (in promise) SyntaxError: The requested module '/@modules/dialog-polyfill/dialog-polyfill.js' does not provide an export named 'default'

What's going on?

Is there some ES module specific problem that causes this?

Is the Firebase UI loading problem connected to us loading Firebase wrong, or are they unrelated?

Why doesn't the recommended ES module way of loading Firebase work?

Is there an app sample that uses Vite or Rollup and has both Firebase and Firebase UI, via npm? Would love to find one.

Current work-around

Loading Firebase UI in index.html - not via npm. Ideally, we'd like to take it via npm because:

• dependency management in one place
• ability to tree-shake

node 14.5.0 firebase 7.15.5 firebaseui 4.5.1 Chrome 83 on macOS

[akauppi]

Looks like this

[akauppi]

Upstream tickets that have to do with this:

• https://github.com/firebase/firebase-js-sdk/issues/3069
• https://github.com/firebase/firebase-js-sdk/issues/3315

Note: The ticket may actually be two different things. Loading Firebase (as pure ESM, in browser) like documents suggest it to be done, and being able to use Firebase-UI from npm.

[akauppi]

FirebaseUI work under:

• firebaseui-web#674

[akauppi]

Firebase loading recommendation has been changed (8.0.0) to import firebase from 'firebase.

Firebase can now be loaded as expected (at least in Vite). FirebaseUI issues remain.

[akauppi]

Also FirebaseUI loaded via import but doesn't quite work. Next version coming to this repo, however, will completely import those libs. Once that happens, this issue can be closed.

Implied change: web no longer needs to set up the firebase global.

[akauppi]

bygones