Vue.js で Firebase を利用するときに警告が出た場合の対処法

プログラミング
この記事は約2分で読めます。
スポンサーリンク

警告が出る場合

import firebase from 'firebase'

このように import すると下記のような警告が出力されます。

It looks like you're using the development build of the Firebase JS SDK.
When deploying Firebase apps to production, it is advisable to only import
the individual SDK components you intend to use.

For the module builds, these are available in the following manner
(replace <PACKAGE> with the name of a component - i.e. auth, database, etc):

CommonJS Modules:
const firebase = require('firebase/app');
require('firebase/<PACKAGE>');

ES Modules:
import firebase from 'firebase/app';
import 'firebase/<PACKAGE>';

Typescript:
import * as firebase from 'firebase/app';
import 'firebase/<PACKAGE>';

対処法

import firebase from 'firebase/app' // 変更
import 'firebase/auth' // 使用する場合は追加する
import 'firebase/database' // 使用する場合は追加する
import 'firebase/firestore' // 使用する場合は追加する

警告に書いてある通り、import firebase from ‘firebase’ を import firebase from ‘firebase/app’ にし、使用したいアプリを更に import することで警告を消すことができました。

上記は、Authentication 、Realtime Database、Cloud Firestore を使用する場合です。

コメント

タイトルとURLをコピーしました