How do I make scss / sass / css-loader not resolve url calls? (Inside WebPack)

Question

I have several calls to url(some-path) in my SCSS file and css-loader is insisting on resolving those URLs to something it knows. These included files are available on the server/web, but aren't visible to WebPack. How can I get it to just accept the strings?

In my scss file I have a font-face, for example:

@font-face {
    font-style: normal;
    font-weight: 400;
    font-family: 'Noto Serif';
    src: url($font-path + 'NotoSerif-Regular.ttf');
}

And I get an error:

Error: Can't resolve '/static/fonts/NotoSerif-Regular.ttf'

I just want it to emit this string without trying to resolve it. I have no rules in my WebPack file that would tell it to include TTF files. I recently upgraded the sass/css/loader node modules; before it was working.

I don't know if the error is coming from WebPack or Sass.

Answer 1

There is a setting in the css-loader to disable URL resolution:

                // Translates CSS into CommonJS
                loader: 'css-loader',
                options: {
                    url: false,
                },

One of the version upgrades must have changed the default for this to true, making it backwards incompatible.