¿Cómo puedo solucionar que la ventana de error no esté definida cuando uso firebase en mi proyecto sveltekit? No puedo montarlo por otras razones y estoy tratando de evitarlo. alguna idea o hay alguna manera de poner la inicialización en el montaje y aún así enviar los datos fuera del montaje
<script> // Import the functions you need from the SDKs you need import { initializeApp } from "firebase/app"; import { getAnalytics } from "firebase/analytics"; import { getFirestore } from "firebase/firestore"; import { onMount } from 'svelte'; import { collection, addDoc } from "firebase/firestore"; // TODO: Add SDKs for Firebase products that you want to use // https://firebase.google.com/docs/web/setup#available-libraries // Your web app's Firebase configuration // For Firebase JS SDK v7.20.0 and later, measurementId is optional let song = 'song'; const firebaseConfig = { }; const app = initializeApp(firebaseConfig); const analytics = getAnalytics(app); const db = getFirestore(app); async function sendSong(){ try { const docRef = await addDoc(collection(db, "songs"), { title: {song}, atist: "test" }); console.log("Document written with ID: ", docRef.id); } catch (e) { console.error("Error adding document: ", e); } } </script> <input bind:value={song}> <style> </style>Esto termino funcionando para mi
<script> // Import the functions you need from the SDKs you need import { initializeApp } from "firebase/app"; import { getAnalytics } from "firebase/analytics"; import { getFirestore } from "firebase/firestore"; import { onMount } from 'svelte'; import { collection, addDoc } from "firebase/firestore"; import { Notyf } from 'notyf'; import 'notyf/notyf.min.css'; // for React, Vue and Svelte // TODO: Add SDKs for Firebase products that you want to use // https://firebase.google.com/docs/web/setup#available-libraries // Your web app's Firebase configuration // For Firebase JS SDK v7.20.0 and later, measurementId is optional let song ; let artist ; let db; onMount(() => { const firebaseConfig = { //redacted }; const app = initializeApp(firebaseConfig); const analytics = getAnalytics(app); db = getFirestore(app); }); async function sendSong(){ try { const docRef = await addDoc(collection(db, "songs"), { song: {song}, atist: {artist} }); console.log("Document written with ID: ", docRef.id); } catch (e) { console.error("Error adding document: ", e); } } </script> <div class="main"> <h1 class="text-primary">Submit a song</h1> <input class="margin" placeholder="song" bind:value={song}> <input class="margin" placeholder="artist" bind:value={artist}> <button on:click={sendSong} id="send-button" type="submit" class="margin sub button primary is-full-width " >Submit Form</button> </div> <style> .margin{ margin-top: .5em; } .main{ margin: 4em; } </style>