CODEWITHSUNDEEP
ember.js
Devin Rhode
Devin Rhode

Reputation: 25347

What is the first javascript file that gets run in ember.js app? (in the browser)

What the very first javascript file that ember looks to run in the browser? I need to access localStorage, so am looking for a file that is actually part of the app js, config/env won't do.

Bonus points: Is this different for apps using Module Unification? I am (unfortunately) using ember 2.13. If you know which file people most typically put their earliest app initialization stuff in, that would be pretty helpful too.

Background info: I need to modify some settings that are defined in environment.js, but I need to read localStorage to determine what settings to apply. Thus, I cannot do this in the actual environment.js file itself. I happen to be using this for a sort of a hack, but it's more of a testing/debugging/developer/inspection utility function that will be used in production from the browser console.

Upvotes: 0

Views: 374

Answers (2)

Ramy Ben Aroya
Ramy Ben Aroya

Reputation: 2423

You can try ember-patch-config. It is a small npm package I wrote for patching/modifying configuration properties at runtime before the app script is even loaded.

Install

npm install ember-patch-config --save-dev

Usage

First you need to import EmberApp from a different location. No worries, it extends the original EmberApp which installed in node_modules: 

// ember-cli-build.js

const EmberApp = require('ember-patch-config/ember-app');

module.exports = function (defaults) {
    const app = new EmberApp(defaults, {
        // ...
    }
}

Then, add an inline script in app/index.html (before the app & vendor scripts):

<!-- app/index.html -->
<!DOCTYPE html>
{{content-for 'rev-header'}}
<html>
  <!-- ... -->
  <body>
    <!-- ... -->
    <script>
        window.configToPatch = {
            property1: 'value1',
            property2: 'value2',
            property3: {
                someKey: 'someValue'
            },
            property4: localStorage.getItem('property4')
        };
    </script>
    <!-- ... -->
  </body>
</html>

The content of window.configToPatch will be DEEPLY MERGED into the module <your-app-name>/config/environment.js at runtime, before the app is initialized (even before initializers).

Upvotes: 2

locks
locks

Reputation: 6577

Have you tried initializers? You can read about them at https://guides.emberjs.com/v3.1.0/applications/initializers/.

Upvotes: 1

Related Questions