82290


NextとTypescriptでWebサイトを作っています。  
Firebaseを導入しようと思い `yarn add firebase`
でFirebaseをインストールしNextに組み込もうとした際、下記のようなエラーが出てしまいました。

[code]

    TypeError: Cannot read property 'apps' of undefined
    
[/code]

lib/firebase.tsとしてFirebaseの設定ファイルを作っています。

[code]

    import firebase from 'firebase/app'
    import 'firebase/analytics'
    import 'firebase/auth'
    import 'firebase/firestore'
    
    if (typeof window !== 'undefined' && firebase.apps.length === 0) {
      const firebaseConfig = {
        〜〜〜〜
      }
    
      firebase.initializeApp(firebaseConfig)
      firebase.analytics()
    }
    
[/code]

**試したこと**  
バージョン 7 以前は `import * as firebase from 'firebase/app'` のようにして import
する必要があるとのことなので（[firebase](https://firebase.google.com/support/release-
notes/js#version_800_-_october_26_2020))、`@import firebase from 〜`
の部分を変えたら以下のようにエラーが変わりました

[code]

    TypeError: Cannot read property 'length' of undefined
    
[/code]

どうかよろしくお願いします。


CC BY-SA 4.0
2021-09-01T11:09:32.093
81163
2021-09-06T09:41:27.313
2021-09-01T11:20:21.303
3060
39431
question
firebase next.js
Firebase環境構築でTypeError: Cannot read property 'apps' of undefinedと出る


firebase SDKのバージョンが9以上ではないですか？  
9以上の場合は、初期化の方法が変わっているみたいです。  
<https://lupas.medium.com/firebase-9-beta-nuxt-js-981cf3dac910>

ご参考になれば幸いです。


CC BY-SA 4.0
2021-09-06T09:41:27.313
82290
2021-09-06T09:41:27.313
19622
81163
answer