Как настроить поддержку Firebase в Nuxt.js?

1

npm install firebase firebase-admin @nuxtjs/firebase

1
2
3
4
5
6
7
8
9

const firebaseConfig = {
  apiKey: '...',
  authDomain: '...',
  projectId: '...',
  storageBucket: '...',
  messagingSenderId: '...',
  appId: '...',
  measurementId: '...'
};

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18

import firebase from 'firebase/app';

export default {
  // ...
  modules: [
    '@nuxtjs/firebase'
  ],
  firebase: {
    config: firebaseConfig,
    services: {
      // Инициализируйте только те сервисы, которые вы будете использовать в своем приложении
      auth: true,
      firestore: true,
      storage: true
    }
  }
  // ...
};

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

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

const firestoreSettings = {}; // Настройки для сервиса Firestore

const firebaseApp = firebase.initializeApp(firebaseConfig);

const auth = firebaseApp.auth();
const firestore = firebaseApp.firestore();
firestore.settings(firestoreSettings);
const storage = firebaseApp.storage();

export { auth, firestore, storage };

1
2
3
4
5
6
7
8

export default {
  // ...
  plugins: [
    // ...
    '~/plugins/firebase.js',
  ]
  // ...
};

1
2
3
4
5
6
7
8
9

import { auth } from '@/plugins/firebase.js';

auth.signInWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // ...
  })
  .catch((error) => {
    // ...
  });