Does not rewrite url in @import

[ikorolev93]

None of the basic examples in the readme work for @import url(...) constructions, they just stay the same.

[bahtou]

Can you share your webpack config?

[danielschwartz85]

I also see the same issue, for example run this snippet and see that the process function is never called.

function process({url}) {
  console.log('never called !!')
  return url;
}

await postcss()
        .use(url({url: process}))
        .process("@import 'some.css';", {from: undefined});

[ankurparihar]

I don't have much context but I was also facing similar problem in my Gatsby project.
The @import url(...) on top of css is parsed by postcss-import and you need to write custom resolve function to change them

https://github.com/postcss/postcss-import#resolve

Something like this - postcss/postcss-import#190 (comment)

[shishkin]

Rewriting url() inside imported files works if postcss-url plugin with proper config is added to the plugins field of the postcss-import plugin config:

const postCssUrl = require("postcss-url")({
  // config here
});

module.exports = {
  plugins: [
    require("postcss-import")({
      plugins: [postCssUrl],
    }),
    postCssUrl,
  ],
};