Use Dart Sass to compile SCSS files

SassC/Libsass has been deprecated for years and has been replaced by
Dart Sass. However, the dartsass-rails gem, maintained by the Rails
team, doesn't support sprockets integration and doesn't allow glob
imports (using `@import something/**/*` or similar). In particular,
dartsass-rails needs to start a separate browser that makes it less
straightforward to change a file and reload the browser.

So we're using sassc-embedded, which provides Dart Sass integration with
sprockets. While there's no guarantee this gem will be maintained a few
years from now, we know for sure that SassC/Libsass won't be maintained
at all, so using sassc-embedded is an improvement over our current
situation.

On my machine, this change reduces compilation times by about 35%.

Note we still depend on the `sassc-rails` gem, for two reasons.

First, we're still importing CSS/Sass content from a couple of gems
(mainly, social-share-button and font-awesome) and we don't know how to
import this content without the `sassc-rails` gem.

And, second, it provides support for glob imports. Without it, we'd have
to manually add every single (S)CSS file we import to the
`application.scss` file instead of being able to write things like
`@import admin/**/*";`.

Note we're removing the `sass` gem from `Gemfile.lock`. We should have
done it as part of e210682ac, but when we developed that branch, it
didn't contain the changes where we removed another gem depending on the
`sass` gem (which we removed in commit 2fa713c64), so Bundler didn't
delete it. However, now that we're changing the Gemfile, Bundler is
finally removing the no-longer-needed `sass` gem and its dependencies.
This commit is contained in:
Javi Martín
2024-03-25 00:26:50 +01:00
parent 21b7f4c96e
commit d54971e536
3 changed files with 10 additions and 8 deletions

View File

@@ -48,6 +48,7 @@ gem "redcarpet", "~> 3.6.0"
gem "responders", "~> 3.1.1" gem "responders", "~> 3.1.1"
gem "rinku", "~> 2.0.6", require: "rails_rinku" gem "rinku", "~> 2.0.6", require: "rails_rinku"
gem "ros-apartment", "~> 2.11.0", require: "apartment" gem "ros-apartment", "~> 2.11.0", require: "apartment"
gem "sassc-embedded", "~> 1.70.1"
gem "sassc-rails", "~> 2.1.2" gem "sassc-rails", "~> 2.1.2"
gem "savon", "~> 2.15.0" gem "savon", "~> 2.15.0"
gem "sitemap_generator", "~> 6.3.0" gem "sitemap_generator", "~> 6.3.0"

View File

@@ -241,6 +241,8 @@ GEM
request_store (~> 1.0) request_store (~> 1.0)
globalize-accessors (0.3.0) globalize-accessors (0.3.0)
globalize (>= 5.0.0) globalize (>= 5.0.0)
google-protobuf (4.26.0)
rake (>= 13)
graphiql-rails (1.8.0) graphiql-rails (1.8.0)
railties railties
sprockets-rails sprockets-rails
@@ -485,9 +487,6 @@ GEM
thor (~> 1.0) thor (~> 1.0)
rainbow (3.1.1) rainbow (3.1.1)
rake (13.1.0) rake (13.1.0)
rb-fsevent (0.11.2)
rb-inotify (0.10.1)
ffi (~> 1.0)
rbtree3 (0.7.1) rbtree3 (0.7.1)
recipient_interceptor (0.3.1) recipient_interceptor (0.3.1)
mail mail
@@ -561,13 +560,13 @@ GEM
capistrano (~> 3.0) capistrano (~> 3.0)
sshkit (>= 1.2) sshkit (>= 1.2)
safely_block (0.4.0) safely_block (0.4.0)
sass (3.7.4) sass-embedded (1.72.0)
sass-listen (~> 4.0.0) google-protobuf (>= 3.25, < 5.0)
sass-listen (4.0.0) rake (>= 13.0.0)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
sassc (2.4.0) sassc (2.4.0)
ffi (~> 1.9) ffi (~> 1.9)
sassc-embedded (1.70.1)
sass-embedded (~> 1.70)
sassc-rails (2.1.2) sassc-rails (2.1.2)
railties (>= 4.0.0) railties (>= 4.0.0)
sassc (>= 2.0) sassc (>= 2.0)
@@ -757,6 +756,7 @@ DEPENDENCIES
rubocop-rails (~> 2.23.1) rubocop-rails (~> 2.23.1)
rubocop-rspec (~> 2.27.0) rubocop-rspec (~> 2.27.0)
rvm1-capistrano3 (~> 1.4.0) rvm1-capistrano3 (~> 1.4.0)
sassc-embedded (~> 1.70.1)
sassc-rails (~> 2.1.2) sassc-rails (~> 2.1.2)
savon (~> 2.15.0) savon (~> 2.15.0)
selenium-webdriver (~> 4.16.0) selenium-webdriver (~> 4.16.0)

View File

@@ -1,3 +1,4 @@
require "sassc-embedded"
require_relative "boot" require_relative "boot"
require "rails" require "rails"