Configuring a package in React/React Native

Question

how do we configure a package in React (in-general).

In NodeJS, We have singleton so we can create an external file, say (./firebase-config.js) and then import it in our main Index.js file (starting point of our node application).

In react till now, I am used to configuring it in Index.html but now I am using react-native which does not have DOM so I can't put my configuration there.

Take index.js or app.js (considering cli version where index.js is the root and app.js is immediate children having all other children) from where I have my config folder at ./src/config/flamelink.js and this to be my configuration

import * as firebase from 'firebase';
import flamelink from 'flamelink';

const firebaseConfig = {
  apiKey: '<your-api-key>', // required
  authDomain: '<your-auth-domain>', // required
  databaseURL: '<your-database-url>', // required
  projectId: '<your-project-id>', // required
  storageBucket: '<your-storage-bucket-code>', // required
  messagingSenderId: '<your-messenger-id>' // optional
};

const firebaseApp = firebase.initializeApp(firebaseConfig);

const app = flamelink({ firebaseApp });

Question: Where should I import it to configure it? or will it React-native work just like node and by just importing, things would work?

AKX · Accepted Answer · 2019-03-06 09:19:14Z

2

Yep, you can just have your configuration in, say, firebase-config.js, which might look like

const firebaseConfig = {
  apiKey: '<your-api-key>', // required
  authDomain: '<your-auth-domain>', // required
  databaseURL: '<your-database-url>', // required
  projectId: '<your-project-id>', // required
  storageBucket: '<your-storage-bucket-code>', // required
  messagingSenderId: '<your-messenger-id>' // optional
};
export default firebaseConfig;

and then do

import firebaseConfig from './firebase-config';

elsewhere in your code.

answered Mar 6, 2019 at 9:19

AKX

171k16 gold badges145 silver badges227 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Configuring a package in React/React Native

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related