Parcel Bundler - handle scss without resolving any urls in my sass

Question

It's great that ParcelJS just handles sass out of the box but I'm running into a problem where it keeps throwing an exception when it encounters a url within in my scss file. I guess Parcel is trying to locate the resource and rewrite the url. I do not want Parcel to do this. Is there anyway to disable this? I just want it to compile the sass and leave any urls in there alone.

Answer 1

This question was posted when Parcel v1 was the latest version. For folks arriving here in the future, you can accomplish this in Parcel v2 with the parcel-resolver-ignore plugin. Here's how:

1. Install it (e.g. yarn add -D parcel-resolver-ignore)
2. Create or modify your .parcelrc file to add it to the parcel pipeline:

   {
      "extends": "@parcel/config-default",
      "resolvers": ["parcel-resolver-ignore", "..."]
   }
   

3. Add a "parcelIgnore" entry to package.json that contains regex patterns that define which resources to ignore, e.g.:

   {
    // An array of Regex patterns
     "parcelIgnore": [
       "images\/*.*",
     ]
   }
   

The things you want to target your regexes to match are the urls referenced in the .scss files, not the .scss files themselves.