CODEWITHSUNDEEP
javascriptreact-native
Sennen Randika
Sennen Randika

Reputation: 1636

How to import something globally in React Native?

I'm developing an App using React Native and Firebase. So, I created a separate js file to store config of firebase database and then I imported that config file into my screen files when I need to connect with firebase database.

So, I have to import that config file into each and every screen file which I need connect with my firebase database.

I want to know that, is it possible to import that config file globally?

I mean, I create a separate config file, then import it only once into a particular js file (Just for an example, let's think, import it only once into the App.js file) and then, use it in my screen files whenever I need to connect with my firebase database. But in this case, is it possible to use that config file without importing it into each and every screen file?

Hope you will understand what I want to do.

Upvotes: 0

Views: 2108

Answers (1)

Junius L
Junius L

Reputation: 16122

Yes, you just import the file in your main screen/ app entry point.

import app from 'firebase/app';
import 'firebase/auth';
import 'firebase/database';
import 'firebase/storage';


const config = {
  apiKey: "API_KEY",
  authDomain: "DOMAIN",
  databaseURL: "DB_URL",
  projectId: "PROJECT_ID",
  storageBucket: "BUCKET",
  messagingSenderId: "MSG_ID",
  appId: "APP_ID"
};
app.initializeApp(config);

module.Store = {

  Firebase() {
    return app;
  },
}


if (global) {
  global.Store = module.Store;
}

In your main screen

import './Global';

all the functions in Global will be available to all screens.

Demo

Upvotes: 2

Related Questions