src\firebaseConnection.js
Line 17:17: 'initializeApp' is not defined no-undef
Search for the keywords to learn more about each error.
webpack compiled with 1 error and 1 warning
enter image description here
You should import like this:
import { initializeApp } from "firebase/app";
const firebaseConfig = {...};
const app = initializeApp(firebaseConfig);
You may want to visit this documentation and learn how to use Firebase Services such as Firestore.
Related
In my React Native project I'm migrating react-native-firebase from version 5 to version 6 using this guide. In the Specific Module Installation section it says to import the functions module using #react-native-firebase/functions and then to import them with import functions from '#react-native-firebase/functions';. However, when I try to update this code:
import * as functions from 'firebase-functions';
import { FeedModel } from '../../../models/feed.model';
export const onFeedCreate = functions.firestore
.document('promos/{uid}')
.onCreate( async (
snapshot,
context
) => {
const promo = snapshot.data() as FeedModel;
console.log(promo);
});
by replacing the first line with #react-native-firebase/functions';, then the term firestore on the third line is underlined in red and says Property 'firestore' does not exist on type 'FirebaseModuleWithStaticsAndApp<Module, Statics>'.
How should I change my imports in order to run this function?
I used Google Analytics a lot for many sites...
I'm just releasing a first app with Firebase (Firestore + Firebase SDK with reactjs).
Then, I activated GA from my Firebase dashboard... but I cannot see any activity !
I probably need not to add plugin like "autotrack" ?
import 'autotrack';
ga('create', 'UA-XXXXX-Y', 'auto');
It's not clear because, it's impossible to find out the track ID (UA-XXXXX-Y) from my dashboard !
Do I really need it ? Where can I find it ?
I did't correctly initialized Analytics...
With firebase it's not a track ID but a measurementId
import app from 'firebase/app';
import 'firebase/analytics';
app.initializeApp({
//other config
measurementId : process.env.REACT_APP_MEASUREMENT_ID,
appId : process.env.REACT_APP_DEV_ID
})
//put inside your constructor
app.analytics()
This will solve the following error:
Error: firebase__WEBPACK_IMPORTED_MODULE_8___default.a.analytics is
not a function react
Documentation : https://firebase.google.com/docs/analytics/get-started?platform=web
The previous answer should be corrected like this:
import app from 'firebase/app';
import 'firebase/analytics';
app.initializeApp({
//other config
measurementId : process.env.REACT_APP_MEASUREMENT_ID,
appId : process.env.REACT_APP_DEV_ID
})
//put inside your constructor
app.analytics()
This will solve the following error:
Error: firebase__WEBPACK_IMPORTED_MODULE_8___default.a.analytics is
not a function react
My issue was the same as listed above:
Error: firebase__WEBPACK_IMPORTED_MODULE_8___default.a.analytics is not a function react
But the resolution was that I forgot to import the analytics module: import 'firebase/analytics';
If you are using Typescript:
// On index.tsx
import { initializeApp } from 'firebase/app';
import { initializeAnalytics } from 'firebase/analytics';
const firebaseConfig = {
... your config object ...
};
const app = initializeApp(firebaseConfig);
initializeAnalytics(app);
Firebase gone through a lot of new updates. Change imports like this;
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
import 'firebase/compat/analytics';
Got error while initializing Firebase configuration in expo react native. Unexpected token ";"
Enviroment:
Expo development
React native
firebase
visual studio code editor
What I want:
I am new , learning how to authenticate /login in react native application using firebase email/password method.
What I did:
In the code editor tool--> app.js--> I imported the firebase , created a const to define the firebase config parameters.
After that, I tried to initialize firebase .
What is the issue:
When I ran the app on my phone , the following error occurred.
SyntaxError: C:\Users\Jituni\bholmentorworld\App.js: Unexpected token, expected ";" (32:23)
30 | };
31 |
32 | firebase.initializeApp{firebaseConfig};
| ^
33 |
34 | export default class App extends React.Component{
35 |
[import React from "react";
import { Image, Button, TextInput, ScrollView, Stylesheet, Text, View } from "react-native";
import * as firebase from 'firebase';
const firebaseConfig={
apiKey:"AIzaSyDimdV7iWkVaLKpQVqt82_TiSuRA0NBAOE",
authDomain:"firebaseapp",
databaseURL:"mentordunia",
projectId:"mentordunia",
storageBucket:"",
messagingSenderId:"1055433782606",
appId:"b308d4b9d990db06",
};
firebase.initializeApp{firebaseConfig};
export default class App extends React.Component{
render() {
return <AppContainer/>;
}
};][1]
Expected result:
Should not receive error to initialize firebase
Actual result:
Error in initialing firebase
I recommend using a linter to catch any possible error, I personally use eslint with vs code.
firebase.initializeApp{firebaseConfig}; should be firebase.initializeApp(firebaseConfig);
I am getting this error when i try to use the rtdb on an angularfire2 app.
ERROR TypeError: firebase_app__WEBPACK_IMPORTED_MODULE_2__.database is not a function
at new AuthService (auth.service.ts:29)
at _createClass (core.js:9272)
at _createProviderInstance$1 (core.js:9234)
at resolveNgModuleDep (core.js:9200)
at NgModuleRef_.push../node_modules/#angular/core/fesm5/core.js.NgModuleRef_.get (core.js:9911)
at resolveDep (core.js:10276)
at createClass (core.js:10152)
at createDirectiveInstance (core.js:10033)
at createViewNodes (core.js:11255)
at callViewAction (core.js:11571)
I imported firebase as follows:
import * as firebase from 'firebase/app';
The following gives me the above error:
db = firebase.database();
Import it like this:
import * as firebase from 'firebase';
import 'firebase/firestore';
use AngularFire2, It can be insalled by npm
I have two deployment targets in my Cloud Functions. I use the command line to determine which project I deploy too. firebase use myTestApp or firebase use myLiveApp
Can I tell which target I am using in my index.js code?
I am hoping for something like this
// change baseURLs and other keys
if (Target == live) {
const baseURL = 'myLiveApp';
const stripekey= 'secreteLivekey';
} else {
const baseURL = 'myTestApp';
const stripekey= 'secreteTestkey';
};
currently I get around this by commenting out the test or live keys and this is very annoying and easy to make a mistake.
You can set the necessary variables in each project's Functions config.
CLI:
firebase use <live_project>
firebase functions:config:set stripe.key="secreteLivekey"
firebase functions:config:set baseURL="myLiveApp"
firebase use <non_live_project>
firebase functions:config:set stripe.key="secreteTestkey"
firebase functions:config:set baseURL="myTestApp"
In code:
import * as functions from 'firebase-functions'
const baseURL = functions.config().baseURL
const stripekey = functions.config().stripe.key
EDIT:
Since your question technically was "Can you know your deployment target?", the answer is yes.
const config = JSON.parse(process.env.FIREBASE_CONFIG)
const projectId = config.projectId