Requirejs multi-page & multi-app not executing define callbacks

Question

I have a multi-page / mulit-application minifcation I'm trying to make work.

the structure is as follows

common/
--main config file that defines the common libs
common/build
--app.build.js (see example below)

application1/
--application
--milion other files

application2/
--application
--thousand other files

this is placed in the header the page(s)

</style><script data-main='common/main' src='libraries/require.js'></script>

footer like this

<script>require(['../application1/application']);</script>
<script>require(['../application2/application']);</script>

This approach works perfect when using a bunch of files, and the applications run and interact perfect However trying to make them into one seems a bit more of a challenge in terms of making it work.Granted I could just be an idiot

Build File

({

    baseUrl: "../",
    mainConfigFile: '../main.js',

    optimize: 'uglify',
    optimizeCss: 'standard',
    out: "../global.min.js",
    //insertRequire: ['main'],

    include: ['../application1/application', '../application2/application'],
    wrap: true // have tried both options - this makes the scenario at the bottom work

})

This works perfect and produces a lovely global.min.js. Challenge is it does not execute the callbacks on define calls I include it like so:

this is placed in the header the page(s)

</style><script data-main='common/main' src='libraries/require.js'></script>

footer like this

<script>require(['../common/global.min']);</script>

HOWEVER: if I keep the old requires in places like so:

<script>require(['../application1/application']);</script>
<script>require(['../application2/application']);</script>

it downloads 3 files

• common/global.min.js
• application1/application.js
• application2/application.js

NOTE: At this point it is missing about 150 files, but the application(s) work perfect.

Having spent some serious time on this, my head is now properly wrecked and I can't figure out how to make it work from a single minified file.

Any help much appreciated as I have tried whatever I could think of. Happy to share all the files, howvere there is a lot of them ;-)

Answer 1

This is an educated guess, based on what you've shown in the question and experience with RequireJS' failure modes. I'm guessing "./common/global.min" is not a module name. (If you want to check this, open your optimized bundle and look at all the define calls. If you find that none of them has "./common/global.min", then it is not a module name.)

When you require "./common/global.min", RequireJS loads the corresponding file, and then looks in it for a module named "./common/global.min". It finds none, and your code does not get to run.

One way to fix this is to use a RequireJS configuration with your optimized bundle that maps names like this:

paths: {
    '../application1/application': './common/global.min'
    '../application2/application': './common/global.min'
}

And call require with these module names instead of "./common/global.min". This configuration tells RequireJS "when you are looking for these modules, look in that file: they are there" and indeed that's what the optimization process does.