Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

111
Views
Problems with firebase authentication in vue3

I want to make a form that will do authentication with the help of firebase 9. Project is made with Vue3. I have an HTML form:

<form @submit.prevent="registr">
        <div class="inputs">
          <div class="input user">
            <i class="fas fa-user"></i>
            <input type="text" placeholder="Username" v-model="username">
          </div>
          <div class="input email">
            <i class="fas fa-at"></i>
            <input type="email" placeholder="Email" v-model="email">
          </div>
          <div class="input password">
            <i class="fas fa-key"></i>
            <input type="password" placeholder="password" v-model="password">
          </div>
        </div>
        <button type="submit"> Sign In </button>
      </form>

imports:

import 'animate.css';
import "firebase/auth"
import { createUserWithEmailAndPassword } from "firebase/auth";

and data & methods in script part:

    data() {
    return{
      username: null,
      email: null,
      password: null,
    }
  },
methods: {
    register(){
      console.log('WORK');
      createUserWithEmailAndPassword(this.email, this.password)
              .then(() => {
                console.log('success')
              })
              .catch(err => {
                console.error(err)
              })
    }
  }

Though, any part of the methods is not working, even simple console.log, which I add to see if form connects with function in the right way. Also, i have an error in console: Uncaught TypeError: firebase_app__WEBPACK_IMPORTED_MODULE_7__.default is undefined. Why method is not working with the form?

To initialize firebase i used following code:

import { initializeApp } from 'firebase/app';
import 'firebase/auth';

const firebaseConfig = {
  apiKey: "#################################",
  authDomain: "decbase-#####.firebaseapp.com",
  projectId: "decbase-#####",
  storageBucket: "decbase-#####.appspot.com",
  messagingSenderId: "############",
  appId: "1:0000000000:web:aaaaaaaaaaaaaaaaaaaaaa"
};
const firebaseApp = initializeApp(firebaseConfig);
export default firebaseApp;
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

in the initialization:

import { initializeApp } from 'firebase/app';
import {getAuth} from 'firebase/auth';
// Your web app's Firebase configuration
const firebaseConfig = {
  apiKey: "############################################",
  authDomain: "#####-#####.firebaseapp.com",
  projectId: "#####-#####",
  storageBucket: "#####-#####.appspot.com",
  messagingSenderId: "############",
  appId: "1:00000000000:web:######################"
};
const firebaseApp = initializeApp(firebaseConfig);
export default getAuth(firebaseApp);

methods& imports in the component:

import "firebase/auth"
import { getAuth, createUserWithEmailAndPassword } from "firebase/auth";
methods: {
    async register(){
      console.log("WORK");
      const auth = getAuth();
      createUserWithEmailAndPassword(auth, this.email, this.password)
              .then(() => {
                console.log("success")
              })
              .catch(err => {
                console.error(err)
              })

    }

and in the HTML part in button tag should be added @click:

<button type="submit" @click="register"> Sign In </button>
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!