Unknown module "Firebase" in React native - reactjs

I am working on some sample apps using react native. I am trying to integrate Firebase plugin followed by firebase tutorial.
I can able to add firebase plugin using
npm install firebase --save
It gets added to node_modules, when i try to require the plugin
var Firebase = require('firebase');
It throws an exceptions "Requiring unknown module 'firebase'...."

First, make sure you've installed the dependency with:
npm install firebase --save
(make sure you are in your project folder)
Then end the NPM process and restart by running react-native start. That should do the trick.

Related

Realm and React error. Can't resolve 'react-native' in app created with create-react-app

I'm attempting to add the Realm package to a project created with create-react-app. I simply run the create script, install the project, then install realm. When I attempt to import or require 'realm' I get a Can't resolve 'react-native' error.
npx create-react-app my-app
cd my-app
npm i
npm i --save realm
npm start
At this point, if I attempt to import realm anywhere in the project, for instance by adding:
import Realm from 'realm';
or
Realm = require('realm');
to App.js or Index.js
I get the following error.
./node_modules/realm/lib/browser/index.js
Module not found: Can't resolve 'react-native' in '/Users/scolobey/Desktop/Projects/realm-blog/node_modules/realm/lib/browser'
As far as I have been able to tell, this seems to be related to webpack. Opening the console on this error page, I see:
./node_modules/realm/lib/browser/index.js
Module not found: Can't resolve 'react-native' in '/Users/scolobey/Desktop/Projects/javascript/my-app/node_modules/realm/lib/browser'
console.<computed> # index.js:1
r # backend.js:6
handleErrors # webpackHotDevClient.js:173
push../node_modules/react-dev-utils/webpackHotDevClient.js.connection.onmessage # webpackHotDevClient.js:212
Create React App is for regular React apps (not mobile/“React Native” apps). Your app is complaining because it expects to find the “react-native” package, which doesn’t come included with Create React App.
You’ll note that Realm’s Installation Guide specifically instructs you to set up react native before installing the package.
As mentioned in the React Native Docs - Getting Started (which is linked to in the above Realm installation guide), you likely want to use expo instead of Create React App.
Once the React Native app is set up, you can proceed with installing Realm.

I want to integrate IronSource ad network with my react native project

I have found a framework for integrating IronSource ad network with my react native project here.
I have a searched a lot in internet and have already tried opening an issue in the repository but no luck.
I did as it said in the readme file like so:
First installing the dependency
npm install #wowmaking/react-native-iron-source --save
Then linking the dependency
react-native link #wowmaking/react-native-iron-source
And finally importing the dependency
import { IronSource } from '#wowmaking/react-native-iron-source';
But as soon as I try to run my application I get this error:
native module cant be null
I don't know if I'm doing it right or not please help!
I'm using react native 0.60.5
I'm contributor of #wowmaking/react-native-iron-source.
Readme was updated for RN 60 last month. You dont need to link it anymore for RN 60.
npm install #wowmaking/react-native-iron-source --save
Add a repo to your android/app/build.gradle file
allprojects {
repositories {
// Existing repos here
// ...
maven { url "https://dl.bintray.com/ironsource-mobile/android-sdk" }
}
}
You are ready to run your app.
Add mediation networks which you need. Follow official docs.
https://github.com/wowmaking/react-native-iron-source#mediation-setup
Re-build your project via:
react-native run-android

Module parse failed with custom npm package

I'm new to React and new to npm module publishing, there is a beginning for all things!
I have created a react module.
I have created a react app (using create-react-app) and i have imported the module directly (not via a npm install).
On this case, i got no errors. The app is compiling without problems.
However, when i'm trying to use my module by importing it from npm (after it's get published), it fails.
To get this issue, i have created another react app (always by using create-react-app) then i have installed my package using npm i --save my-module-name.
I'm importing it commonly by using import { SomeComponent } from 'my-module-name' instead of importing it directly.
And i got the following error
Module parse failed: Unexpected token (59:37)
You may need an appropriate loader to handle this file type.
| }
|
| generateRecoverActionsContainers = () => {
|
After some searchs, it seems to come from the Webpack configuration. But, during my searchs, i saw that people recommand to not touch the react Webpack default configuration.
From there, i'm a bit lost on how to fix that and also, why it was compiling when the module was imported directly and not compiling when it was importing from node_modules... Should i had a webpack configuration in my npm module?
Thanks in advance for your precious help!
When you publish a module on npm, you should publish compiled code. Webpack doesn't compile node_modules

React app with the create react app commad. How do i include bootstrap?

So i created a react app using the create-react-app folder-name from cmd
So how do i add bootstrap and other libraries to launch on npm start i.e. when i launch the app. Do i install them with bower install or with npm install. I am so new to this i don't even get how are all the scdripts from the framework are launching with idnex.html. I know that the question is probably somewhat retarded, but idk how to even ask it correctly.
You can add any libraries you want utilizing npm and ES6 Import
Just Import anything you want in App.js.
Here is step by step guide on adding bootstrap to your project.

Using React Dev Tools with Preact

I have just got preact-redux-example up and running, and now I am attempting to use Preact Dev Tools in my app.
Based on this post I assumed it was a case of adding
import 'preact/devtools'
into the entry point (app.js) file.
However, this yields the following error:
./src/components/app.js
Module not found: Error: Cannot resolve module 'preact/devtools'
Is there something else I need to install, or am I on the wrong track?
preact/devtools has landed in version 6.4.0, but the example project uses version 4.8.0. So you need to upgrade the preact version to be able to import it:
npm install --save preact#latest
Or if you're using yarn you can run:
yarn upgrade preact

Resources