require-css: including a css file who's path has "css" in it (ex: bootstrap/css/bootstrap.css)

Question

My require.js config:

require.config({
    paths: {
        css: "../libs/require-css/css",
    },
    map: {
        "*": {
            less: "../libs/require-less/less",
            css: "../libs/require-css/css"
        }
    }
});

I'm trying to include a css file that has "css" in dir name

require([
    "css!bootstrap/../css/bootstrap"
], function(
) {

Gets interpreted as libs/require-css/css/bootstrap.css because css is in the directory name. How would I get require to treat css in the path a literal

Denis Pitcher · Accepted Answer · 2014-11-01 15:53:28Z

3

You'll need to change the path you'd like to use.

Instead of:

paths: {
   css: "../libs/require-css/css",
},

use this

paths: {
   require-css: "../libs/require-css/css",
},

Then reference it as

require([
    "require-css!bootstrap/../css/bootstrap"
], function(
) {

The paths just work as a shortcut or alias to the longer location of the file so you can use any value you like for it.

answered Nov 1, 2014 at 15:53

Denis Pitcher

3,2901 gold badge29 silver badges20 bronze badges

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

Comments

user1087079 · Accepted Answer · 2017-01-22 01:38:18Z

0

Any short module name in paths should not exist in a file path.

For example, if path : {css: 'path/to/require/css'}, and

require(['css!css/style.css'],  function () {});

'css' string in style.css's file path will be replaced with the module css's path. so that equals to

require(['css!path/to/require/css/style.css'],  function () {});

To prevent this problem, you can replace css module name with 'require-css' like Denis did

path : {require-css: 'path/to/require/css'};
require(['require-css!css/style.css'],  function () {});

or replace css directory name 'css' with 'style'

path : {css: 'path/to/require/css'};
require(['css!style/style.css'],  function () {});

answered Jan 22, 2017 at 1:38

user1087079

1,35612 silver badges10 bronze badges

Collectives™ on Stack Overflow

require-css: including a css file who's path has "css" in it (ex: bootstrap/css/bootstrap.css)

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related