Workaround for node-sass hanging in Parcel

This is a quick guide on how to get around an issue with the Parcel web application bundler hanging when compiling multiple SASS/SCSS files that have imports in them (#1836, #1331).

This appears to be a problem within node-sass and concurrent calls.

Parcel > 1.9.7: use dart-sass instead

An upcoming release of Parcel will look for node-sass and if that doesn’t exist, look for sass. This is a pure JavaScript implementation of Sass called “Dart Sass”, and it does not have this problem. You can simply uninstall node-sass and replace it with the Dart Sass sass library:

yarn remove node-sass
yarn add -D sass # this is dart-sass

Tada, you’re done! But currently this is only on the master branch of Parcel.

If you’re using an older version of Parcel take a look at the lower options.

Parcel <= 1.9.7: limit concurrent calls

It appears you can modify the PARCEL_MAX_CONCURRENT_CALLS environment variable to limit the number of parallel calls, as seen here with github user @jayprado running parcel-bunder "1.9.6" and node "v8.11.3".

Update your parcel scripts—or wherever you run parcel—to have this environment variable set:

{
  "scripts": {
    "start": "PARCEL_MAX_CONCURRENT_CALLS=3 parcel src/index.html"
  }
}

This approach keeps it very localized to the project and easier to clean up in the future than if you left it in .bash_profile or similar file and forgot about it.