After some discussion on the rails/webpacker
issues I have a better solution for this. See the updated post for details.
Ran into a problem installing Rails 6.0.0.rc2 on Heroku. Being a good Rails citizen I was trying use Webpacker and all it’s JS goodness.
Then I spent two days trying to figure out why assets wouldn’t compile when deploying to heroku. And I got this frustratingly vague error:
Compilation failed:
!
! Precompiling assets failed.
!
! Push rejected, failed to compile Ruby app.
! Push failed
After some digging I found out you can enable errors in Webpacker by editing config/webpacker.yml
:
- webpack_compile_output: false
+ webpack_compile_output: true
Which showed errors (yay!):
ERROR in ./app/javascript/theme/style.scss (./node_modules/css-loader/dist/cjs.js??ref--7-1!./node_modules/postcss-loader/src??ref--7-2!./node_modules/sass-loader/lib/loader.js??ref--7-3!./app/javascript/theme/style.scss)
Module build failed (from ./node_modules/sass-loader/lib/loader.js):
Error: ENOENT: no such file or directory, scandir '/tmp/build_b6d942494af54889b656091b0e3a440f/node_modules/node-sass/vendor'
See this gist for the full log.
Turns out this is due to a strange bug with node-sass where it needs to be re-built after updating modules. The solution is is to add a postinstall script to your package.json
:
"scripts": {
"postinstall": "npm rebuild node-sass"
}
Cool, thought this would fix it. But still got the same error above. When I connected to a bash terminal in teh heroku console I found a weird error:
~ $ npm rebuild node-sass
bash: npm: command not found
Wut? I thougth node was part of the Ruby build pack on Heroku. Turns out, we need the Node.js buildpack to get a npm
binary.
So I added the buildpack, making sure to put the node one earlier in the list.
Then I got a sweet green “Build Succeeded” message in Heroku.