react-native error after import firebase - firebase

I have installed firebase package in my project using cmd
npm install --save firebase
When I import firebase to my react-native project import firebase from 'firebase' I'm getting this error. What could be the problem?

Follow this pattern the error will be resolved the issue is due to upgradation in Firebase repo:
import React, {Component} from 'react';
import {Text, View} from 'react-native';
// import firebase from 'firebase';
import firebase from '#firebase/app'
import { Header } from './Components/Common';

Ran into Same issue i solved it by installing babel polyfill
npm i --save-dev babel-polyfill
then in my index.js:
import 'babel-polyfill';

thats because of the recent version of firebase you can roll back to version 4 or you can import like
import firebase from '#firebase/app';
any of the above two approaches will solve your problem

Related

Vue 3 - Bootstrap Rollup Failure

I'm new Vue, I don't understand this error from installing bootstrap-vue-3
Install commands:
npm i --save bootstrap bootstrap-vue-3
Configuration [main.js]:
import { createApp } from 'vue'
import App from './App.vue'
import './index.css'
import BootstrapVue3 from 'bootstrap-vue-3'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue-3/dist/bootstrap-vue-3.css'
createApp(App)
.use(BootstrapVue3)
.mount('#app')
Errors:
Rollup failed to resolve import "bootstrap/js/dist/carousel" from "node_modules/bootstrap-vue-3/dist/bootstrap-vue-3.es.js".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to rollupInputOptions.external
This is a new project -- nothing added aside from default stuff and bootstrap.

Css working fine for development but not being applied after production buid - React

I created an app using create-react-app, while running the code for development using npm start the pages are loading fine with all the css but when I build the project using npm run build the css won't load. Below are the attached screenshots and code snippets.
Page being loaded in development.
Same page when the build folder is served.
Here is the App.js imports
import React, { useEffect, useState } from "react";
import "bootstrap/dist/css/bootstrap.min.css";
import "jquery/dist/jquery.min.js";
import "bootstrap/dist/js/bootstrap.min.js";
import "./assets/css/classy-nav.min.css";
import "./assets/vendors/font-awesome/v5.9.0/all.css";
import "./assets/vendors/animate-css/animate.css";
import "./assets/vendors/magnify-popup/magnific-popup.css";
import "./assets/css/style.css";
import "owl.carousel/dist/assets/owl.carousel.css";
import "owl.carousel/dist/assets/owl.theme.default.css";
import { toast, ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import $ from "jquery";
import { WOW } from "wowjs";
toast.configure();
You might just need to run npm start after npm install.

/src/firebase.js Module not found: Can't resolve 'firebase' in '/Users/anujgoyal/Desktop/reels/src'\?

image of the project and files
I am trying to import firebase in my react app, using the following syntax:
import firebase from "firebase";
But I am facing following issue:
./src/firebase.js
Module not found: Can't resolve 'firebase' in '/Users/Desktop/reels/src'
commands i have ran on terminal:
npm i firebase
Also i have checked in the node modules firebase was there.
You should try this code
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
I think you're using the ^9 version, so try this:
import firebase from 'firebase/compat/app'

importing firebase to react-native

I'm trying to use the firebase in a react native project
I installed the firebase in my project:
npm install --save firebase
and I'm importing it into my app.js
import firebase from 'firebase';
import React, { Component } from 'react';
import {
Platform,
Text,
View
} from 'react-native';
type Props = {};
export default class App extends Component<Props> {
render() {
return (
<View >
<Text>Testando Firebase</Text>
</View>
);
}
}
and then the error is displayed:
Objects are not valida as a react child (found: object with
keys{&&typeof, type, key, ref, props, _owner, _store}). If you meant
to render a collection of children, use an array instead.
but when I remove the import from firebase, the app works perfectly.
Try to install the version 5.0.2. Use this command as administrator:
npm uninstall firebase
npm install --save firebase#5.0.2
As far as i see, the current version (5.0.4) is buggy!
You need to import as follow
import * as firebase from 'firebase';
You first must have firebase installed.
The solution is to uninstall the current version of Firebase and install an older version.
1st step npm uninstall firebase
2nd step npm i firebase#8.0.3
It was the version that worked for my case.

No such module PushNotifications (Swift 4 + Xcode 9.0) Firebase

Use Xcode9, Swift4 no work on real Iphone6
Two issues:
Redefinition of Module 'Firebase'
No such module 'UserNotifications'
but if I use Simulator all is good!
install firebase pod and import following modules
import Firebase
import FirebaseMessaging
import UserNotifications

Resources