user26268062
user26268062

Reputation: 1

Unable to use firebase in svelte

I am trying to add some code to previous github repo but while using firebase after creating a page in src/routes folder I am unable to use it. Do I have to use firebase compat? As that also didn't work and give lot of errors

Here's the src/routes/about/+page.svelte where I want my firebase google oauth to be implemented

<!-- src/routes/about/+page.svelte -->
<script lang="ts">
  import { auth } from '$lib/firebase'; // Import Firebase auth from firebase.js

  async function signInWithGoogle() {
    const provider = new firebase.auth.GoogleAuthProvider();
    try {
      const result = await auth.signInWithPopup(provider);
      const user = result.user;
      // Redirect to localhost:4173 or handle the redirect as needed
      window.location.href = 'http://localhost:4173'; // Adjust the URL as needed
    } catch (error: any) {
      console.error('Firebase Authentication Error:', error.code, error.message);
    }
  }
</script>

<h1>About Page</h1>

<p>This is the about page.</p>

<button on:click={signInWithGoogle}>Sign in with Google</button>

Here's terminal error:

vite v5.2.9 building SSR bundle for production...
✓ 671 modules transformed.
x Build failed in 10.18s
error during build:
RollupError: src/routes/about/+page.svelte (3:11): "auth" is not exported by "src/lib/firebase.js", imported by "src/routes/about/+page.svelte".
file: C:/Users/admin/Documents/plinko-game/plinko-game-main/src/routes/about/+page.svelte:3:11
1: <!-- src/routes/about/+page.svelte -->
2: <script lang="ts">
3:   import { auth } from '$lib/firebase'; // Import Firebase auth from firebase.js
              ^
4: 
5:   async function signInWithGoogle() {
    at getRollupError (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/parseAst.js:392:41)
    at error (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/parseAst.js:388:42)
    at Module.error (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:13688:16)
    at Module.traceVariable (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:14136:29)
    at ModuleScope.findVariable (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:11817:39)
    at ReturnValueScope.findVariable (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:6037:38)
    at FunctionBodyScope.findVariable (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:6037:38)
    at FunctionScope.findVariable (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:6037:38)
    at FunctionBodyScope.findVariable (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:6037:38)
    at BlockScope.findVariable (file:///C:/Users/admin/Documents/plinko-game/plinko-game-main/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:6037:38)
 ELIFECYCLE  Command failed with exit code 1.

Here are the problems: https://i.postimg.cc/Qt55MN8j/Screenshot-243.png

Here's firebase.js I have edited config keys

// firebase.js

import firebase from 'firebase/app';
import 'firebase/auth';

const firebaseConfig = {
    apiKey: "AIzaSyAQsJwwdg10AN8h9JqrPClg7OuWSo",
    authDomain: "myapp.firebaseapp.com",
    databaseURL: "https://myapp-ault-rtdb.firebaseio.com",
    projectId: "myap",
    storageBucket: "myapp-4c.appspot.com",
    messagingSenderId: "926146820",
    appId: "1:926140906820:web:d0e3195d6eeea2ab11"
};

if (!firebase.apps.length) {
  firebase.initializeApp(firebaseConfig);
}

export default firebase;

Upvotes: 0

Views: 47

Answers (0)

Related Questions