postcss-resolve-urls

A PostCSS plugin for resolving relative URLs

IMPORTANT This plugin depends on source maps

Given a directory structure like this

project/
├── images/
│   ├── logo.svg
└── css/
    ├── partials/
    │   └── partial.css
    ├── input.css
    └── output.css

1/** input.css */
2@import './partials/partials.css';
3
4/** partial.css */
5section {
6    background-image: url('../../images/logo.svg')
7}
8
9/** output.css */
10section {
11    background-image: url('../images/logo.svg')
12}

Install

npm i -D postcss-resolve-urls

Usage

1import postCssResolveUrls from 'postcss-resolve-urls'
2
3const output = postcss([
4        postCssResolveUrls()
5    ])
6    .process(YOUR_INPUT_CSS);

If this PostCSS plugin helped you in any way please consider buying me a book @ my buymeacoffee.com page

TODO:

• Include tests