Merge pull request #3190 from alphagov/migrate-to-dart-sass

Migrate to Dart Sass from LibSass

.gitignore

@@ -7,6 +7,8 @@
 tmp/*
 log/*.log
 public/assets
+/app/assets/builds
+!/app/assets/builds/.keep
 
 # See https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
 .yarn/cache/

Gemfile

@@ -6,14 +6,14 @@ gem "rails", "7.1.2"
 
 gem "actionpack-page_caching"
 gem "bootsnap", require: false
+gem "dartsass-rails"
 gem "gds-api-adapters"
 gem "govuk_app_config"
 gem "govuk_personalisation"
 gem "govuk_publishing_components"
 gem "nokogiri"
 gem "plek"
 gem "redis"
-gem "sassc-rails"
 gem "sprockets-rails"
 gem "uglifier"
 

Gemfile.lock

@@ -108,6 +108,9 @@ GEM
     crack (0.4.5)
       rexml
     crass (1.0.6)
+    dartsass-rails (0.5.0)
+      railties (>= 6.0.0)
+      sass-embedded (~> 1.63)
     date (3.3.4)
     debug_inspector (1.1.0)
     docile (1.4.0)
@@ -527,14 +530,9 @@ GEM
     ruby-progressbar (1.13.0)
     ruby2_keywords (0.0.5)
     rubyzip (2.3.2)
-    sassc (2.4.0)
-      ffi (~> 1.9)
-    sassc-rails (2.1.2)
-      railties (>= 4.0.0)
-      sassc (>= 2.0)
-      sprockets (> 3.0)
-      sprockets-rails
-      tilt
+    sass-embedded (1.69.5)
+      google-protobuf (~> 3.23)
+      rake (>= 13.0.0)
     selenium-webdriver (4.14.0)
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 3.0)
@@ -561,7 +559,6 @@ GEM
     statsd-ruby (1.5.0)
     stringio (3.1.0)
     thor (1.3.0)
-    tilt (2.0.11)
     timeout (0.4.1)
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)
@@ -593,6 +590,7 @@ DEPENDENCIES
   binding_of_caller
   bootsnap
   climate_control
+  dartsass-rails
   gds-api-adapters
   govuk_app_config
   govuk_personalisation
@@ -608,7 +606,6 @@ DEPENDENCIES
   rails (= 7.1.2)
   redis
   rubocop-govuk
-  sassc-rails
   shoulda-context
   simplecov
   sprockets-rails

app/assets/config/manifest.js

@@ -1,9 +1,5 @@
 //= link_tree ../images
 //= link application.js
 //= link test-dependencies.js
-//= link application-ie8.css
-//= link application-print.css
-//= link application.css
-//= link guides-print.css
-//= link print.css
 //= link modules/base-target.js
+//= link_tree ../builds

app/assets/stylesheets/helpers/_draft.scss

@@ -1,5 +1,5 @@
 .draft main {
-  background-image: image-url("draft-watermark.png");
+  background-image: url("draft-watermark.png");
   background-repeat: repeat-y;
   background-position: 50% 0;
   background-size: contain;

config/environments/production.rb

@@ -33,10 +33,6 @@
   # Do not fallback to assets pipeline if a precompiled asset is missed.
   config.assets.compile = false
 
-  # Rather than use a CSS compressor, use the SASS style to perform compression.
-  config.sass.style = :compressed
-  config.sass.line_comments = false
-
   # Enable serving of images, stylesheets, and JavaScripts from an asset server.
   # config.asset_host = "http://assets.example.com"
 

config/initializers/dartsass.rb

@@ -0,0 +1,8 @@
+# config/initializers/dartsass.rb
+Rails.application.config.dartsass.builds = {
+  "application-ie8.scss" => "application-ie8.css",
+  "application-print.scss" => "application-print.css",
+  "application.scss" => "application.css",
+  "guides-print.scss" => "guides-print.css",
+  "print.scss" => "print.css",
+}