css-loader: :local + url(File) - unexpected behaviour

this works well

:local(.selectLocale) {
  background: url(SelectLocale72x72.png) no-repeat 90% #eee;
}

This (without brackets)

:local .selectLocale {
  background: url(SelectLocale72x72.png) no-repeat 90% #eee;
}

throws an error

ERROR in ./~/css-loader!./~/cssnext-loader!./src/components/SelectLocale.css
Module not found: Error: Cannot resolve module 'SelectLocale72x72.png'

That’s a bug, right? Or I missed something? What form should I use? Very confusing and unexpected. I’ve read a mention about that, but it explained nothing to me 😦

About this issue

Original URL
State: closed
Created 9 years ago
Comments: 19 (6 by maintainers)

Most upvoted comments

Please reopen the issue. It still exists more than one year, css-loader cannot resolve url without modules: true.

alex-shamshurin on Sep 19, 2017

the issue is caused by cssnano that I use as one of PostCSS plugins. the trick is to force set normalizeUrl: false which apparently is set to true by default. 🤦‍♂️

config.postcss = function () {
  let postPluginConf = [];
  postPluginConf.push(
    require('autoprefixer')({
      browsers: ['> 0.0001%'],
      cascade: true,
      remove: true
    })
  );
  postPluginConf.push(
    require('css-mqpacker')()
  );
  if (production || testing) {
    postPluginConf.push(
      require('cssnano')({
        discardComments: {
          removeAll: true
        },
        zindex: false,
        normalizeUrl: false
      })
      // ["zindex", "normalizeUrl", "discardUnused", "mergeIdents", "reduceIdents"]
    );
  }
  return postPluginConf;
};

kroko on Dec 26, 2016