Assets' paths are resolved relatively to the file where the mixin was called rather than to where the mixin was defined

[wujekbogdan]

I would expect the paths to be always resolved relative to where the mixin was defined rather than to where the mixin is called. Is the current behaviour a bug or is it how it is supposed to work?

Example:

// css/utils/mixins.scss
@define-mixin bg {
  background: url('../../assets.bg.svg')
}

// css/components/component-1.css
.element-1 {
  @mixin bg;
}

// css/components/nested/component-2.css
.element-2 {
  @mixin bg;
}

In such a scenario I'm getting compilation errors in the last example because '../../assets.bg.svg' is not a valid path relatively to css/components/nested/component-2.css file.

[ai]

postcss-mixins doesn’t change mixin content. It inserts content as is by design.

You can use function mixins with any logic what you want.

[wujekbogdan]

@ai
Thanks for the explanation.