Parcel: How can I make sass ignore url() paths?

[dherran]

❔ Question

How can I make the sass compilation task ignore all url() references and leave those paths intact?

🔦 Context

For example, I have a background image that I store in a public folder on the server. Parcel is attempting to find the jpg, if not found, throws an error. If found, it copies the jpg file to the same directory of the compiled css file.

💻 Code Sample

Source sass path: /resources/assets/scss/app.scss
Dist font path: /assets/img/
Dist css path: /assets/css/

parcel watch resources/assets/scss/app.scss --out-dir assets/css --public-url /assets/css

.hero {
    background-image: url(../img/a_background_image.jpg);
}

Parcel tries to find/resources/assets/img/a_background_image.jpg and then copies it to /assets/css/a_background_image.jpg

I would like for sass to not resolve those URLs, just leave them as they are. Is that possible?

🌍 Your Environment

| Software | Version(s) |
| ---------------- | ---------- |
| Parcel | 1.12.3
| Node | 10.16.0
| npm/Yarn | 1.17.3
| Operating System | Ubuntu 16.04 via WSL in Windows 10 Pro build 1903

[mischnic]

Is that possible?

No, that isn't possible unfortunately.

Duplicate issues: https://github.com/parcel-bundler/parcel/issues/1087, https://github.com/parcel-bundler/parcel/issues/1186

[onosendi]

I am having this issue too. I can't have parcel copying the image defined in url() to my 'dist' directory, and re-writing the path. I need url() to be left alone in my scss file.

[rijkvanzanten]

Is there any workaround available?