Storing JS variable before react js loaded

Question

We have Rails app with react as front-end framework .. I need to store some hash value in javascript variable like

windows.FeatureFlag = {featureA: true, featureB:false}

before all files are loading... we are loading the js file in the following order

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require react-server
//= require react_ujs
//= require_tree .

I'm trying to set the above FeatureFlag before the react js loaded... I have tried adding DOMContentLoaded but still, the variable defined as undefined..

I react file we require/set multiple different values and all are depending on this variable to avoid multiple server calls...

how to achieve?

penner · Accepted Answer · 2018-12-21 21:57:02Z

1

Jared's answer would work but it adds another request for the client, doesn't get preprocessed, needs to be included in all the layouts. I would:

Create a new file for the script... call it react_config.js

windows.FeatureFlag = {featureA: true, featureB:false}

then:

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require react_config.js
//= require react-server
//= require react_ujs
//= require_tree .

application.js is already included in the

answered Dec 21, 2018 at 21:57

penner

2,7772 gold badges40 silver badges50 bronze badges

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

1 Comment

Ferdy Over a year ago

Thank you for the answer

Jared Beck · Accepted Answer · 2018-12-21 19:07:42Z

0

Put it at the top of the document <head>

<head>
  <script>
    window.featureFlags = {featureA: true, featureB:false};
  </script>
  <!-- now load everything else -->
</head>

Usually, the <head> is in app/views/layouts/application.

You may also find content_for useful.

answered Dec 21, 2018 at 19:07

Jared Beck

17.7k11 gold badges76 silver badges106 bronze badges

1 Comment

Ferdy Over a year ago

Thank you for your the answer but unfortunately, react execute faster than the rails asset pipeline and I have achieved in the same custom react require file

Collectives™ on Stack Overflow

Storing JS variable before react js loaded

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related