Предупреждение. Похоже, вы используете сборку разработки Firebase JS SDK

Я интегрировал Firebase в свое приложение React.js следующим образом: https://firebase.google.com/docs/database/web/start.

fire.js:

import firebase from 'firebase'

var config = {
  apiKey: "####",
  authDomain: "#",
  databaseURL: "#",
  projectId: "#",
  storageBucket: "#",
  messagingSenderId: "#"
};
var fire = firebase.initializeApp(config);
export default fire;

App.js:

import fire from './fire';

class App extends Component {
    componentWillMount(){
        let messagesRef = fire.database().ref('messages').orderByKey().limitToLast(100);
    }
}

Но теперь я получаю это предупреждение в консоли:

Похоже, вы используете сборку разработки Firebase JS SDK. При развертывании приложений Firebase в рабочей среде рекомендуется импортировать только отдельные компоненты SDK, которые вы собираетесь использовать.

Для сборок модуля они доступны следующим образом (замените на имя компонента - т.е. auth, database и т.д.):

Модули CommonJS: const firebase = require ('firebase/app'); требовать ( 'firebase/');

ES Модули: импорт FireBase из "FireBase/приложения"; импортировать 'firebase/';

Как мне исправить это предупреждение?

Я попытался (в fire.js) изменить это:

import firebase from 'firebase'

К этому:

import firebase from 'firebase/app'

Это приводит к этой ошибке:

Ответ 1

Правильный способ импорта firebase таков:

import firebase from 'firebase/app';
import 'firebase/database'; // If using Firebase database
import 'firebase/storage';  // If using Firebase storage

Ответ 2

Предупреждение довольно информативно и точно определяет, что вам нужно делать. В вашем случае это строка, которая говорит вам переключить способ импорта файлов:

Модули ES: импортировать firebase из "firebase/app"; import 'firebase/';

В файле fire.js попробуйте изменить это:

import firebase from 'firebase'

К этому:

import firebase from 'firebase/app'

Это должно прояснить это!

Примечание:

В моем случае я использовал firestore поэтому у меня был дополнительный импорт, который я также изменил с:

import firestore from 'firebase/firestore'

Для того, чтобы:

import 'firebase/firestore'

Ответ 3

Правильный способ импортировать базу данных и избавиться от предупреждений:

Всегда импортировать таким образом

import firebase from 'firebase/app';

Затем импортируйте каждый субмодуль (каждый сервис Firebase) по мере необходимости

import 'firebase/auth';        // for authentication
import 'firebase/storage';     // for storage
import 'firebase/database';    // for realtime database
import 'firebase/firestore';   // for cloud firestore
import 'firebase/messaging';   // for cloud messaging
import 'firebase/functions';   // for cloud functions