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

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'

Related

Build failed: npm ERR! Cannot read property 'firebase-admin' of undefined

I am trying to update a Firebase Cloud Function that I havent touched for a year. Deployment went without issues back then.
Here is my setup: I have a root index.ts file, and functions are organized into folders.
root index.ts
import {initializeApp} from "firebase-admin";
// Initialize Firebase Admin
initializeApp();
export {notifyNewMessages} from "./notify_new_messages";
export {onUpdateUsers, onUpdateUserRatings} from "./on_update/index";
export {onUninstall} from "./on_uninstall/index";
and notifyNewMessages file starts like this
import {FirebaseError, firestore, messaging} from "firebase-admin";
import * as functions from "firebase-functions";
import i18n from "./localization";
import {Ask, Device, User} from "./models";
import DocumentSnapshot = firestore.DocumentSnapshot;
const fcm: messaging.Messaging = messaging();
Could this separated root file cause this problem?
Cheers,
It looks like you are using ES Modules, and as firebase has moved to modular SDK namespace versions require some modifications so try the following:
import * as admin from 'firebase-admin';
const app: admin.app.App = admin.initializeApp();
You can go through this docs for other changes to be made.

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.

why the code is showing module not found?

import firebase from 'firebase'
firebase.initializeApp({
..
})
export default firebase
Module not found: Can't resolve 'firebase' in 'C:\Users\shravan\Documents\MERN stack\Courier App\client\src\component
Even after installing firebase why it is showing so?

react-native error after import 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

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.

Resources