Skip to content
This repository has been archived by the owner on Mar 23, 2024. It is now read-only.

Modules get loaded but won't execute, when using precompiled assets on staging and prod #70

Open
heartcode opened this issue Oct 1, 2012 · 3 comments

Comments

@heartcode
Copy link

I am having an annoying issue Rails 3.2.3.

The project is set up to use the assets pipeline for some files, and RequireJS is setup separately to handle modules. In the dev environment, when the assets are not precompiled, everything works just fine.

Unfortunately in staging and production the modules won't work anymore.

After rake assets:precompile I can see all the modules precompiled, ready to go, and loaded in the browser when I hit the page, but non of the juice the module should do works.

Below I included the code I am using to access my module:

The generated RequireJS source:

<script>var require = {"baseUrl":"/assets","paths":{"page1":"/assets/page1-65007fcb586328f4b0570112e901e236","page2":"/assets/page2-891433d4b4762054226ef1724113a8c3","page3":"/assets/page3-33a86932722c914917d6baa7edcc3f97"}};</script>
<script data-main="/assets/page1-65007fcb586328f4b0570112e901e236" src="/assets/require-0b4496496bdeb7cbd09f2e710baec25e.js"></script>

The contents of page1.js file:

console.log('before page1 module');
define([],
function () {
  console.log('page1 module');
});
console.log('after page1 module');

After hitting the page the console output looks like this:

before page1 module 
after page1 module 

There is no errors in the console whatsoever.

Any help would be much appreciated!

@jbwyme
Copy link

jbwyme commented Oct 3, 2012

Also seeing this issue, anyone have any suggestions?

@jwhitley
Copy link
Owner

jwhitley commented Oct 3, 2012

I think this may be a problem related to changes in RequireJS 2.x. See Upgrading to RequireJS 2.0, especially:

So RequireJS 2.0 will not execute the module's factory function (the function passed to define()), until there has been a require([]) call that has asked for it, or something that depends on it. The use of data-main on the require.js script tag counts as a require([]) call, so most best-practices use of require.js should not notice a difference.

IIRC, you can try changing the top-level page define calls to require calls and see if that works. Apologies for the delayed response; I've been very heads-down on work issues followed by some travel with virtually no 'net access. If that doesn't work, give a holler on the requirejs group to see if anyone there has suggestions for you.

@heartcode
Copy link
Author

Hi @jwhitley,

Thanks for your reply. We found the solution in the mean time, but we have been a bit busy here, so haven't had the chance to post it.

We've also found that using require and creating an instance of the module solves the problem.

After the original require script tag we added the following:

<script>
  require(['page1'], function(FirstPage){
    var page = new FirstPage();
  })
</script>

Now it works like a charm :)

Cheers!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants