Alexander Mills
Alexander Mills

Reputation: 100190

Confused between modules and bundles property in RequireJS / r.js build files

I am very confused at to what the difference is between the "bundles" property and the "modules" property in a r.js build file that might look something like:

({
    "allowSourceOverwrites": false,
    "preserveLicenseComments": false,
    "findNestedDependencies": false,
    "optimizeAllPluginResources": true,
    "dir":"../public/bundles",
    "baseUrl": "../public/static",
    "optimize":"none",
    "mainConfigFile": "../public/static/app/js/main.js",
    "normalizeDirDefines": "all",
    "paths" :{
        requireLib : 'vendor/require',
        jqueryUI: "empty:",
        jqueryUICSS: "empty:"
    },
    "modules": [
        {
            name: "shared",
            include: [
                'jquery',
                'async',
                'backbone'
            ],
            exclude:[]
        }
    ],
    "bundles": {
        'shared': [],
        'secondary': []
    },
    "stubModules":['text']
})

I am having a lot of trouble finding good information on how to create multiple bundles for a RequireJS project. When I just use the modules property and eliminate the bundles property, r.js goes looking for a file called shared.js - and I am not sure why.

Upvotes: 2

Views: 476

Answers (1)

Louis
Louis

Reputation: 151441

r.js creates bundles, but the bundles option is not an option that r.js recognizes. If you look in the file that lists all r.js options, you won't find bundles there. If you remove it from your configuration, you'll get the same behavior.

When I just use the modules property and eliminate the bundles property, r.js goes looking for a file called shared.js - and I am not sure why.

r.js looks for shared.js because your modules specifies a module named "shared". r.js will do this unless you tell it that you want to create this module from scratch, and you do this by adding the create: true option to this module's build configuration:

"modules": [
    {   
        name: "shared",
        create: true, // <<<--- add this!
        include: [
            'jquery',
            'async',
            'backbone'
        ],
        exclude:[]
    }
],

Upvotes: 4

Related Questions