Rails: Precompiled assets missing node modules

[jonhue]

I am using yarn with my rails 5.1 app (not webpacker, just the default asset pipeline).

Running a local server in development environment, I experience no issues with my assets.

But as soon as I precompile my assets (the environment doesn't matter) or let Heroku package my assets, all stylesheets (of node modules) I imported from within my application.sass file don't work anymore.

The reason for that behavior is that sass compiles all files into one output file, but because of some reason appears to miss the @import statements, which include node modules and loads these files separately.

So this:

@import "components/index.sass"
@import "node_module/nodemodule.css"

Compiles to this in development:

// content of "components/index.sass"
// content of "node_module/nodemodule.css"

and to this in production:

// content of "components/index.sass"
@import "node_module/nodemodule.css"

while loading node_module/nodemodule.css separately as an asset, but the browser cannot resolve it.

[s0nspark]

Sounds like you need to add the node_modules folder to your asset load path in the assets.rb initializer:

Rails.application.config.assets.paths << Rails.root.join('node_modules')

[jonhue]

@s0nspark

I created a new issue for the problem described here. #417