Firebase 9.6.6 JS from CDN errors out-CodePudding

I am trying to hook CDN based firebase libs for one of my project and as per the doc its doable https://firebase.google.com/docs/web/alt-setup

But when i put below html/js code

<html>
<body>
  <script type="module">
    import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.6.6/firebase-app.js'
    // Add Firebase products that you want to use
    import { auth } from 'https://www.gstatic.com/firebasejs/9.6.6/firebase-auth.js'
    const firebaseConfig = {
        apiKey: "<>",
        authDomain: "<>.firebaseapp.com",
        projectId: "<>",
        storageBucket: "<>.appspot.com",
        messagingSenderId: "<>",
        appId: "<>",
        measurementId: "<>"
   };
    // Initialize Firebase
    const app = initializeApp(firebaseConfig);
  </script>
</body>
</html>

Its error out with below log (seen on console)

Uncaught SyntaxError: import not found: auth

I do not want to fallback to older version of firebase, so is there any solution someone can suggest?

CodePudding user response：

You're importing the modular SDK, which does not export an auth symbol. To get access to the auth service, import the getAuth function:

import { getAuth } from 'https://www.gstatic.com/firebasejs/9.6.6/firebase-auth.js'

And then call it as:

const auth = getAuth();

// And then for example: createUserWithEmailAndPassword(auth, email, password)

I recommend keeping the Firebase documentation on getting started with authentication on the web handy while getting started, as it has handy copy/pasteable code snippets for common operations like this.