Parcel Build Fails on Heroku due to node-sass

[JakeCooper]

🐛 bug report

Parcel build errors out with the following error when building:

  > DarklaunchDashboard@1.0.0 postinstall /tmp/build_3d19bc047aa04fb3d2678d15f504bef7
  > npm run build
       
       
  > DarklaunchDashboard@1.0.0 build /tmp/build_3d19bc047aa04fb3d2678d15f504bef7
  > parcel build ./client/index.html
       
  lscpu: failed to determine number of CPUs: /sys/devices/system/cpu/possible: No such file or directory

After updating the heroku env variable to PARCEL_WORKERS=1, build hangs indefinitely.

🎛 Configuration (.babelrc, package.json, cli command)

{
  "name": "DarklaunchDashboard",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "build-watch": "parcel watch ./client/index.html",
    "start-watch": "nodemon server/index.js",
    "dev": "concurrently --kill-others \"npm run start-watch\" \"npm run build-watch\"",
    "build": "parcel build ./client/index.html",
    "prod": "npm run build && node server/index.js",
    "start": "node server/index.js",
    "postinstall": "npm run build"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "classnames": "^2.2.6",
    "downloadjs": "^1.4.7",
    "express": "^4.16.3",
    "express-session": "^1.15.6",
    "firebase": "^5.8.0",
    "mobx": "^5.5.0",
    "mobx-react": "^5.2.8",
    "node-sass": "^4.11.0",
    "parcel-bundler": "^1.11.0",
    "pg": "^7.8.0",
    "postcss-modules": "^1.3.2",
    "react": "^16.5.2",
    "react-dom": "^16.5.2",
    "react-router-dom": "^4.3.1",
    "socket.io": "^2.1.1",
    "socket.io-client": "^2.1.1",
    "store": "^2.0.12"
  },
  "devDependencies": {
    "@types/auth0-js": "^8.11.8",
    "@types/firebase": "^3.2.1",
    "@types/react": "^16.0.9",
    "@types/react-dom": "^16.0.0",
    "typescript": "^3.0.3"
  }
}

🤔 Expected Behavior

It should build.

😯 Current Behavior

It doesn't build

💁 Possible Solution

It seems to have occurred once my sass modules gained sufficient size. Trying to figure out exactly what it is in the meantime.

💻 Code Sample

🌍 Your Environment

Heroku Free Tier

[louh]

Hey there! 👋

We had a very similar problem with our project. After a ton of research and debugging, we found that it was related to this issue: #1836 -- in short, when multiple SCSS files import the same file in parallel (e.g. another SCSS file containing shared variables), Parcel will hang indefinitely on Heroku after a certain threshold number of imports. For us, it was on the 8th import.

The solution was to replace node-sass with the sass package. We were already using sass for linting, and node-sass was only used for bundling SCSS with Parcel, so we just removed the node-sass dependency, and it became an easy fix for us. I might suggest trying the same thing in your project to see if that would help.

Unfortunately, there's only a small note about this in the docs. Since I see this come up again and again (e.g. #2430) I think it might be a worthwhile suggestion to the Parcel maintainers to include a deprecation notice for node-sass when it uses it for a build. That way, when builds do hang, there is another clue in the log. The lscpu warning on Heroku is unfortunately a red herring and we also chased that lead unfruitfully.

Hope that helps!

[JakeCooper]

@louh Thanks a ton man! That sucks to hear, but sounds about right! I've now even hit a point where building locally doesn't work either.

So is there any way to use sass modules? Or are we completely SOL.

[louh]

You can still use sass modules with the sass or dart-sass packages (they are the same).

[JakeCooper]

Perfect!