From d765179a5f281686f60c0e0691791a938abc9804 Mon Sep 17 00:00:00 2001 From: D Chua Date: Tue, 5 Mar 2024 10:19:20 +0000 Subject: [PATCH 1/7] Update Gemfile This replaces `sassc-rails` with dartsass-rails` and also adds `sprockets-rails` which is still a required dependency. --- Gemfile | 3 ++- Gemfile.lock | 19 ++++++++----------- 2 files changed, 10 insertions(+), 12 deletions(-) diff --git a/Gemfile b/Gemfile index c30d94b19..fddb877e3 100644 --- a/Gemfile +++ b/Gemfile @@ -5,6 +5,7 @@ gem "rails", "7.1.3.2" gem "active_model_serializers" gem "bootsnap", require: false gem "chartkick" +gem "dartsass-rails" gem "friendly_id" gem "gds-sso" gem "govuk_app_config" @@ -15,9 +16,9 @@ gem "mysql2" gem "octicons_helper" gem "octokit" gem "plek" -gem "sassc-rails" gem "sentry-sidekiq" gem "sprockets" +gem "sprockets-rails" gem "uglifier" group :test, :development do diff --git a/Gemfile.lock b/Gemfile.lock index 6e76524ce..c21cf842a 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -117,6 +117,9 @@ GEM bigdecimal rexml crass (1.0.6) + dartsass-rails (0.5.0) + railties (>= 6.0.0) + sass-embedded (~> 1.63) database_cleaner (2.0.2) database_cleaner-active_record (>= 2, < 3) database_cleaner-active_record (2.1.0) @@ -140,7 +143,6 @@ GEM faraday-net_http (>= 2.0, < 3.2) faraday-net_http (3.1.0) net-http - ffi (1.16.3) friendly_id (5.5.1) activerecord (>= 4.0.0) gds-api-adapters (93.0.0) @@ -593,14 +595,9 @@ GEM rubocop-factory_bot (~> 2.22) ruby-progressbar (1.13.0) ruby2_keywords (0.0.5) - 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.71.1) + google-protobuf (~> 3.25) + rake (>= 13.0.0) sawyer (0.9.2) addressable (>= 2.3.5) faraday (>= 0.17.3, < 3) @@ -636,7 +633,6 @@ GEM statsd-ruby (1.5.0) stringio (3.1.0) thor (1.3.1) - tilt (2.3.0) timecop (0.9.8) timeout (0.4.1) tzinfo (2.0.6) @@ -674,6 +670,7 @@ DEPENDENCIES byebug capybara chartkick + dartsass-rails database_cleaner factory_bot_rails friendly_id @@ -693,11 +690,11 @@ DEPENDENCIES rails (= 7.1.3.2) rails-controller-testing rubocop-govuk - sassc-rails sentry-sidekiq shoulda-context simplecov sprockets + sprockets-rails timecop uglifier webmock From a6141fcaf5a7d93d6dae75d25e521084de3fc71a Mon Sep 17 00:00:00 2001 From: D Chua Date: Tue, 5 Mar 2024 10:41:18 +0000 Subject: [PATCH 2/7] Create /builds folder `.gitignore` is also updated to ignore all files in the `/builds` folder except for `.keep`. --- .gitignore | 4 ++++ app/assets/builds/.keep | 0 2 files changed, 4 insertions(+) create mode 100644 app/assets/builds/.keep diff --git a/.gitignore b/.gitignore index 2396d06e4..fd91e7a7b 100644 --- a/.gitignore +++ b/.gitignore @@ -29,3 +29,7 @@ /yarn-error.log /public/assets + +# dartsass-rails +/app/assets/builds/* +!/app/assets/builds/.keep diff --git a/app/assets/builds/.keep b/app/assets/builds/.keep new file mode 100644 index 000000000..e69de29bb From b443ed16476ffcee3456e29aa8612bbbc655a25a Mon Sep 17 00:00:00 2001 From: D Chua Date: Tue, 5 Mar 2024 10:42:45 +0000 Subject: [PATCH 3/7] Update the manifest file This removes references to CSS files, and adds a `link_tree` directive link to all files in all subdirectories of the `/builds` folder. --- app/assets/config/manifest.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js index de9dc83e2..79c9df477 100644 --- a/app/assets/config/manifest.js +++ b/app/assets/config/manifest.js @@ -1,4 +1,4 @@ //= link_tree ../images //= link application.js //= link admin.js -//= link application.css +//= link_tree ../builds From 8a89175cad105147f6de0b86e0d742d0f4c6f3d0 Mon Sep 17 00:00:00 2001 From: D Chua Date: Tue, 5 Mar 2024 12:55:00 +0000 Subject: [PATCH 4/7] Add an initializer This initializer should configure build options, incorporating the `--quiet-deps` option which tells Sass to suppress dependency deprecation warnings. --- config/initializers/dartsass.rb | 1 + 1 file changed, 1 insertion(+) create mode 100644 config/initializers/dartsass.rb diff --git a/config/initializers/dartsass.rb b/config/initializers/dartsass.rb new file mode 100644 index 000000000..559e9b2ed --- /dev/null +++ b/config/initializers/dartsass.rb @@ -0,0 +1 @@ +Rails.application.config.dartsass.build_options << " --quiet-deps" From a6cc313acf4c30856762b38459b8f0fa196a84af Mon Sep 17 00:00:00 2001 From: D Chua Date: Tue, 5 Mar 2024 11:46:12 +0000 Subject: [PATCH 5/7] Delete unused Sass configuration This was previously added for `sassc-rails` and is no longer needed. --- config/environments/production.rb | 4 ---- 1 file changed, 4 deletions(-) diff --git a/config/environments/production.rb b/config/environments/production.rb index dca0f1323..5eb3e8f80 100644 --- a/config/environments/production.rb +++ b/config/environments/production.rb @@ -28,10 +28,6 @@ config.assets.js_compressor = :uglifier - # Rather than use a CSS compressor, use the SASS style to perform compression. - config.sass.style = :compressed - config.sass.line_comments = false - # Do not fallback to assets pipeline if a precompiled asset is missed. config.assets.compile = false From 12747f58fcd45c0285f6836de251c3761b55798d Mon Sep 17 00:00:00 2001 From: D Chua Date: Tue, 5 Mar 2024 12:11:02 +0000 Subject: [PATCH 6/7] Add `bin/dev` and `Procfile.dev` The `bin/dev` file calls `Procfile.dev`, which runs the rails server and runs `dart-sass` in `watch` mode. Running Sass in `watch` mode means stylesheets are continuously updated when Sass files are changed. --- Procfile.dev | 2 ++ bin/dev | 6 ++++++ 2 files changed, 8 insertions(+) create mode 100644 Procfile.dev create mode 100644 bin/dev diff --git a/Procfile.dev b/Procfile.dev new file mode 100644 index 000000000..852e6c710 --- /dev/null +++ b/Procfile.dev @@ -0,0 +1,2 @@ +web: bin/rails server -p 3000 +css: bin/rails dartsass:watch diff --git a/bin/dev b/bin/dev new file mode 100644 index 000000000..a97073e78 --- /dev/null +++ b/bin/dev @@ -0,0 +1,6 @@ +#!/usr/bin/env sh +if ! gem list foreman -i --silent; then + echo "Installing foreman..." + gem install foreman +fi +exec foreman start -f Procfile.dev "$@" From af4dc6be82bfdffb04c3ceda8f2e9874d640145a Mon Sep 17 00:00:00 2001 From: D Chua Date: Tue, 5 Mar 2024 12:12:28 +0000 Subject: [PATCH 7/7] Turn off digests This will allow us to see the latest stylesheet changes when running Sass in watch mode. --- config/environments/development.rb | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/config/environments/development.rb b/config/environments/development.rb index a68c4951a..c26e8aaf1 100644 --- a/config/environments/development.rb +++ b/config/environments/development.rb @@ -54,6 +54,10 @@ # Suppress logger output for asset requests. config.assets.quiet = true + # Disable digest to see the latest stylesheet changes when running Sass in watch mode + # See https://guides.rubyonrails.org/v7.1.3/asset_pipeline.html#turning-digests-off + config.assets.digest = false + # Raises error for missing translations. config.i18n.raise_on_missing_translations = true