firebase.auth n'est pas une fonction
J'utilise Webpack avec firebase et firebase-admin.
Pour installer firebase j'ai couru
npm install --save firebase
J'importe firebase en utilisant,
import * as firebase from 'firebase/app'
import 'firebase/auth'
J'ai aussi essayé
import * as firebase from 'firebase'
Et j'ai essayé
const firebase = require('firebase')
Comme suggéré dans guide de démarrage Web
Lorsque j'essaie d'utiliser firebase.auth(), j'obtiens une erreur
console.js: 32 TypeError: firebase.auth n'est pas une fonction
Lorsque j'utilise le débogueur pour inspecter firebase, je constate qu'il n'a en fait pas de fonction auth:
> firebase
{__esModule: true, initializeApp: ƒ, app: ƒ, Promise: ƒ, …}
Comment puis-je obtenir auth () en tant que fonction utilisant webpack?
Merci.
Edit: Ceci est pas une copie de la question dans le commentaire. Cette question fait référence à une méthode membre du service d'authentification, et non au service d'authentification lui-même.
Ok, cela a été corrigé en supprimant mon répertoire node_modules et en réinstallant tout.
De plus, j'importe Firebase comme ceci:
import firebase from 'firebase'
require('firebase/auth')
Je ne sais pas.
¯\_(ツ)_/¯
Je sais que vous avez réglé votre problème, mais il n’ya pas de réponse réelle au problème initial ... Le problème ne venait pas du node_modules, mais de la manière dont vous importiez le composant.
Lorsque vous exportez un composant ES6 comme vous le faites normalement, export default () => { console.log('default component export'); };
default est le mot-clé ici. Lorsque vous importez un composant ES6 comme import firebase from 'firebase', il récupère la propriété default à partir de l'objet exporté.
En gardant à l'esprit l'exemple ci-dessus, voici ce que vous avez fait de mal.
Utilisation de ES6:
import * as firebase from 'firebase'
console.log(firebase.auth) // Undefined
console.log(firebase.default.auth) // Function
Utilisation de ES5:
var firebase = require('firebase')
console.log(firebase.auth) // Undefined
console.log(firebase.default.auth) // Function
Notez le .default
J'espère que cela aide à expliquer ce qui n'allait pas en premier lieu.
J'ai gardé une erreur qui disait
"TypeError: firebase.auth n'est pas une fonction"
L'objet d'authentification est apparu et ce que j'ai fait différemment, c'est d'installer les modules dans un ordre différent.
La première fois que j'ai installé les modules (c'est alors que l'objet auth n'apparaissait pas):
// this seems to confuse things with the auth object when installed in this order
$ npm install firebase-admin --save
$ npm install firebase --save
J'ai supprimé le dossier npm et recommencé à zéro, mais cette fois j'ai inversé l'ordre d'installation:
// for some reason this worked and now I can access the auth object
$ npm install firebase --save
$ npm install firebase-admin --save
Je n'ai rien fait d'autre. J'ai simplement inversé l'ordre d'installation en installant firebase en premier et firebase-admin en second.
J'espère que cela fonctionne pour d'autres personnes.
il suffit d'ajouter>
import firebase from '@firebase/app';
require('firebase/auth');
dans votre projet
Je suis tombé dessus aussi. Mon problème était le module npm @firebase a été installé ainsi que le module firebase. Lorsque j'ai requis Firebase dans mon code JavaScript avec ‘require (« firebase »)’, le pack Web fourni à la place de @firebase pour une raison quelconque.
@firebase n'inclut pas auth, base de données, etc. par défaut ... il est modulaire, vous pouvez donc en avoir besoin séparément. En conséquence, j'ai reçu l'erreur ci-dessus lorsque j'ai essayé d'appeler auth ().
Pour résoudre ce problème, vous pouvez supprimer @firebase ... ou simplement ajouter le chemin d'accès complet à la bonne base de feu lorsque vous en avez besoin, comme
require ('/ path/to/node_modules/firebase/firebase.js')
Si le même problème se posait, je pense que c’est à cause des problèmes de versions… .. Je résous le problème en supprimant node_modules et tous les éléments générés par webpack et en prenant les versions de ici .
Btw, je pense que c'est un comportement très étrange, parce que cela devrait fonctionner comme dans la documentation officielle.
Qu'est-ce qu'il y a. Je me suis heurté à cela alors que je travaillais dans Ajout de Firebase to React Native tutorial de William Candillon ...
Réflexions: Il y a beaucoup à aimer de Firebase. Mais l'import/export, nommé vs default et le versioning semblent amener beaucoup de gens à avoir très mal au cœur. <- Je dis cela avec des larmes coulant sur mon visage et un trou dans mon cœur où l'amour du développement mobile et de l'enfance malheureuse existait il y a quelques heures à peine.
En d'autres termes: j'avais firebase.auth is not a function. Je suis allé à la recherche de nœuds_modules, supprimé, filé de nouveau, lu des blogs, essayé d'importer en tant que nommé puis par défaut, nécessitant des modules séparés a-la require('firebase/auth'); sous l'importation par défaut de Firebase, etc., etc. (ça ne devrait vraiment pas être aussi difficile). Aussi, pourquoi Google n'a-t-il pas réagi à la documentation? Nous sommes en 2018. Les gens continuent-ils sérieusement de placer des balises de script HTML dans leur frontal?
Solution actuelle => à la fin, j’ai mis toute ma configuration et ma firebase.initializeApp(config) dans mon application de niveau supérieur. Je vais devoir trouver le temps plus tard de comprendre pourquoi le module d'authentification "@firebase" ne peut pas être importé. Ou pourquoi c'est même là? Est-ce que j'en ai besoin? Pourquoi tout cela n'est-il pas inclus dans le module «Ajout de base»?
Quoi qu'il en soit, ce serait mon conseil. Faites-le travailler au plus haut niveau en premier. Puis collez les informations d'identification dans un fichier séparé ultérieurement. Ça et "Ne bois pas de bière. Ça gonfle et IPA est infiniment plus gentil." ????????????
Ma solution: Supprimer complètement les nœuds, NPM, NVM et réinstaller
Ce problème m’est arrivé plusieurs fois dans le passé (chaque fois que j’essayais de mettre à jour ou d’installer mes nœuds_modules). J'ai littéralement tout essayé ci-dessus. Cela semblait toujours commencer à fonctionner de manière aléatoire et je ne pouvais utiliser aucune solution précédemment documentée la prochaine fois que l'erreur se produirait.
Je pense que j'ai peut-être eu des problèmes de report depuis que j'ai commencé à utiliser Firebase au tout début, alors que j’avais fait quelques hacks bizarres dans macOS pour que firebase fonctionne correctement.
En gros, cette solution supprime complètement toute trace de node/npm/nvm de votre Mac et la réinstalle pour utiliser la version exacte du nœud exécuté par firebase. Ceci utilise nvm. Par conséquent, si vous avez d'autres projets nécessitant des versions de nœud différentes, vous pouvez passer d'une version à l'autre du nœud à la volée.
1. Supprimer les modules de nœud existants
Dans le dossier de votre projet, supprimez tous les dossiers node_modules que vous avez.
2. Supprimer le nœud
Ceci est le tutoriel que j'ai utilisé pour supprimer manuellement le noeud . Au début, je me souviens d'avoir dû changer quelque chose pour installer un noeud dans un répertoire différent (en raison de problèmes d'autorisations), alors j'ai également effectué des recherches supplémentaires sur mon ordinateur pour supprimer ces fichiers et dossiers d'autres domaines.
3. Enlevez NPM
4. Supprimer NVM
Ceci est le tutoriel que j'ai utilisé pour supprimer manuellement NVM
5. Redémarrer
Après avoir tout supprimé et redémarré bash (ou le redémarrage de votre Mac comme je l’ai fait pour des raisons de sécurité) - taper node, npm et nvm dans la console devrait simplement retourner command not found.
6. Réinstallez le nœud et le NPM avec NVM uniquement
NVM vous permet d'installer une version spécifique du noeud. Étant donné que j'utilise le composant d'exécution firebase_fonctions noeud 8 (version bêta), j'ai installé la version cible indiquée du noeud 8 (à partir de maintenant, noeud 8.11.1 ). Ceci est toujours en version bêta, les fonctions de Firebase utilisent le noeud 6.11.5 au moment de cette écriture.
Instructions pour installer node, npm avec nvm
7. Mettre à jour manuellement le NPM
NVM a installé une version plus ancienne de npm. Cette commande met à jour NPM dans sa dernière version.
npm install npm@latest -g
8. Installez vos modules
Redémarrez votre application de terminal au cas où, puis revenez au dossier de votre projet et exécutez la commande npm install.
9. Re-Build & Re-Deploy
Si vous utilisez Webpack, reconstruisez votre projet. Puis déployer ou servir localement.
Ce processus a résolu le problème pour moi. Espérons que cela fonctionne pour vous et vous n'avez pas à faire de trucs de hack. Il me semblait que tout ce que j'avais à faire était de nettoyer.