multiple css modules with r.js optimizer?

Question

r.js optimiser can create multiple js modules as in

 modules: [
        {
            name: "main",
            exclude: [
                "infrastructure"
            ]
        },
        {
            name: "infrastructure"
        }
    ],

Is there a way to create multiple css outputs?
Because one page needs set of css files and another page needs different set of css files.

kryger · Accepted Answer · 2014-01-23 22:26:16Z

1

r.js will automatically inline contents of @import url(...) links in all .css files found in the project directory. If you structure your CSS files correctly you can achieve modularisation, for example:

page1.css

@import url("common/shared.css");
@import url("page-1-specific.css");

page2.css

@import url("common/shared.css");
@import url("page-2-specific.css");

After running through r.js page1.css and page2.css will contain actual contents of the referenced files, i.e. contents of "shared.css" will be included in both of them.

edited Jan 23, 2014 at 22:26

answered Jan 23, 2014 at 17:00

kryger

13.2k8 gold badges47 silver badges68 bronze badges

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

2 Comments

eugene Over a year ago

Thanks for the answer. How do I tell r.js to create page1.css and page2.css separately? I only see cssIn, out option in the r.js documentation.

kryger Over a year ago

@eugene all r.js does is inline the contents, you create the files yourself. No special configuration necessary.

Collectives™ on Stack Overflow

multiple css modules with r.js optimizer?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related