How can I compile SCSS in a Rails 8 project using Propshaft?

It turns out that using sassc‑rails (and its underlying sassc gem) in Rails 8 can be problematic for a couple of reasons:

1. sassc‑rails is unmaintained:
   The sassc‑rails gem hasn’t been maintained since 2019, which means it may not work well with newer versions of Ruby or Rails. This is why your Rails 8 (Ruby 3.4.1) project is failing to build its native extension.

2. Propshaft and asset processing:
   Rails 8 with the new Propshaft asset pipeline delegates asset delivery to a simpler pipeline that doesn’t include built‑in support for SCSS preprocessing. Previously (in Rails 7 with Sprockets) you might have relied on sassc‑rails for on‑the‑fly compilation. With Propshaft, you need to compile your SCSS into CSS before serving it.

Recommended Approaches

Use dartsass‑rails

The Rails community is moving toward more actively maintained alternatives. One recommended solution is to use the dartsass‑rails gem. This gem leverages Dart Sass (the primary implementation of Sass) and can handle your SCSS compilation without the hassle of native gem extensions. To use it:

1. Remove sassc‑rails from your Gemfile.

2. Add the following to your Gemfile:

   RUBYCopied
   gem 'dartsass-rails'

3. Run:

   BASHCopied
   bundle install

4. Ensure you update your asset references to load the compiled CSS.

Alternatively, Consider cssbundling‑rails

If you’re open to having a separate CSS build process, you can also consider cssbundling‑rails. This gem allows you to use popular tools like Dart Sass, PostCSS, Tailwind CSS, etc. It sets up a Node-based build process (unless you use a standalone version such as with dartsass‑rails or tailwindcss‑rails) that watches or precompiles your CSS:

1. Run the install generator for cssbundling‑rails:

   BASHCopied
   rails css:install:sass

   This command sets up the build scripts and configuration.

2. Follow the generated instructions to integrate the CSS build step into your development and production workflow.

Conclusion

With Rails 8 and Propshaft, the old approach of adding sassc‑rails won’t work reliably. Instead, switch to dartsass‑rails or use cssbundling‑rails to handle your SCSS. These alternatives will provide better support for modern Ruby and Rails versions while giving you a smoother asset compilation process.