From 660f43f2388fd9022047c6bdfa2c7b3501896c33 Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Fri, 12 Jan 2024 15:42:30 +0000 Subject: [PATCH 1/5] Replace sassc-rails with dartsass-rails --- Gemfile | 2 +- Gemfile.lock | 18 +++++++----------- 2 files changed, 8 insertions(+), 12 deletions(-) diff --git a/Gemfile b/Gemfile index 7b30cd47c..2067e6047 100644 --- a/Gemfile +++ b/Gemfile @@ -6,6 +6,7 @@ gem "rails", "7.0.8" gem "bootsnap", require: false gem "dalli" +gem "dartsass-rails" gem "gds-api-adapters" gem "govspeak" gem "govuk_ab_testing" @@ -19,7 +20,6 @@ gem "rails-i18n" gem "rails_translation_manager" gem "rinku", require: "rails_rinku" gem "rss" -gem "sassc-rails" gem "slimmer" gem "sprockets-rails" gem "uglifier" diff --git a/Gemfile.lock b/Gemfile.lock index 6f29e4baf..e4a65e7af 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -106,6 +106,9 @@ GEM crass (1.0.6) csv (3.2.5) dalli (3.2.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) @@ -114,7 +117,6 @@ GEM execjs (2.8.1) faker (3.2.2) i18n (>= 1.8.11, < 2) - ffi (1.15.5) gds-api-adapters (92.1.0) addressable link_header @@ -548,14 +550,9 @@ GEM sanitize (6.1.0) crass (~> 1.0.2) nokogiri (>= 1.12.0) - 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.7) + google-protobuf (~> 3.25) + rake (>= 13.0.0) selenium-webdriver (4.16.0) rexml (~> 3.2, >= 3.2.5) rubyzip (>= 1.2.2, < 3.0) @@ -591,7 +588,6 @@ GEM terminal-table (3.0.2) unicode-display_width (>= 1.1.1, < 3) thor (1.3.0) - tilt (2.0.11) timecop (0.9.8) timeout (0.4.1) tzinfo (2.0.6) @@ -622,6 +618,7 @@ DEPENDENCIES capybara climate_control dalli + dartsass-rails faker gds-api-adapters govspeak @@ -644,7 +641,6 @@ DEPENDENCIES rinku rss rubocop-govuk - sassc-rails shoulda-context simplecov slimmer From babdd8c576314c690b05840ad88775d8aa0acb92 Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Wed, 11 Oct 2023 14:29:20 +0100 Subject: [PATCH 2/5] Configure builds - Create `dartsass.builds` initializer and add all Sass files to be compiled. See https://github.com/rails/dartsass-rails#configuring-builds - Create .keep - Update manifest file to use /builds directory - Ignore /builds --- .gitignore | 2 ++ app/assets/builds/.keep | 0 app/assets/config/manifest.js | 18 +----------------- config/initializers/dartsass.rb | 24 ++++++++++++++++++++++++ 4 files changed, 27 insertions(+), 17 deletions(-) create mode 100644 app/assets/builds/.keep create mode 100644 config/initializers/dartsass.rb diff --git a/.gitignore b/.gitignore index de3b8a108..f6cf9383e 100644 --- a/.gitignore +++ b/.gitignore @@ -16,6 +16,8 @@ /tmp /public/assets +/app/assets/builds/* +!/app/assets/builds/.keep /test/wraith/wip* shots/* /coverage diff --git a/app/assets/builds/.keep b/app/assets/builds/.keep new file mode 100644 index 000000000..e69de29bb diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js index 3fd49beb7..1b6313e59 100644 --- a/app/assets/config/manifest.js +++ b/app/assets/config/manifest.js @@ -1,20 +1,4 @@ //= link_tree ../images //= link application.js //= link webchat.js -//= link application.css -//= link components/_back-to-top.css -//= link components/_banner.css -//= link components/_contents-list-with-body.css -//= link components/_download-link.css -//= link components/_error-message.css -//= link components/_figure.css -//= link components/_important-metadata.css -//= link components/_published-dates.css -//= link components/_publisher-metadata.css -//= link views/_guide.css -//= link views/_html-publication.css -//= link views/_manual.css -//= link views/_published-dates-button-group.css -//= link views/_service_manual_guide.css -//= link views/_specialist-document.css -//= link views/_travel-advice.css +//= link_tree ../builds diff --git a/config/initializers/dartsass.rb b/config/initializers/dartsass.rb new file mode 100644 index 000000000..16ee521ff --- /dev/null +++ b/config/initializers/dartsass.rb @@ -0,0 +1,24 @@ +APP_STYLESHEETS = { + "application.scss" => "application.css", + "components/_back-to-top.scss" => "components/_back-to-top.css", + "components/_banner.scss" => "components/_banner.css", + "components/_contents-list-with-body.scss" => "components/_contents-list-with-body.css", + "components/_download-link.scss" => "components/_download-link.css", + "components/_error-message.scss" => "components/_error-message.css", + "components/_figure.scss" => "components/_figure.css", + "components/_important-metadata.scss" => "components/_important-metadata.css", + "components/_published-dates.scss" => "components/_published-dates.css", + "components/_publisher-metadata.scss" => "components/_publisher-metadata.css", + "views/_guide.scss" => "views/_guide.css", + "views/_html-publication.scss" => "views/_html-publication.css", + "views/_manual.scss" => "views/_manual.css", + "views/_published-dates-button-group.scss" => "views/_published-dates-button-group.css", + "views/_service_manual_guide.scss" => "views/_service_manual_guide.css", + "views/_specialist-document.scss" => "views/_specialist-document.css", + "views/_travel-advice.scss" => "views/_travel-advice.css", +}.freeze + +all_stylesheets = APP_STYLESHEETS.merge(GovukPublishingComponents::Config.all_stylesheets) +Rails.application.config.dartsass.builds = all_stylesheets + +Rails.application.config.dartsass.build_options << " --quiet-deps" From 9ede8e97f9e98b109a9307309cc8eae4ee11c31f Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Thu, 31 Aug 2023 11:17:41 +0100 Subject: [PATCH 3/5] Add `watch` task Also, turn digests off in development --- Procfile.dev | 2 ++ bin/dev | 8 ++++++++ config/environments/development.rb | 3 +++ startup.sh | 3 +-- 4 files changed, 14 insertions(+), 2 deletions(-) create mode 100644 Procfile.dev create mode 100755 bin/dev diff --git a/Procfile.dev b/Procfile.dev new file mode 100644 index 000000000..5b7a2b2cd --- /dev/null +++ b/Procfile.dev @@ -0,0 +1,2 @@ +web: bin/rails server -p 3090 +css: bin/rails dartsass:watch diff --git a/bin/dev b/bin/dev new file mode 100755 index 000000000..74ade1664 --- /dev/null +++ b/bin/dev @@ -0,0 +1,8 @@ +#!/usr/bin/env sh + +if ! gem list foreman -i --silent; then + echo "Installing foreman..." + gem install foreman +fi + +exec foreman start -f Procfile.dev "$@" diff --git a/config/environments/development.rb b/config/environments/development.rb index fbf8292a4..c611908ea 100644 --- a/config/environments/development.rb +++ b/config/environments/development.rb @@ -45,6 +45,9 @@ # Suppress logger output for asset requests. config.assets.quiet = true + # To see the latest stylesheet changes, if running Sass in watch mode + config.assets.digest = false + # Raises error for missing translations. config.i18n.raise_on_missing_translations = true diff --git a/startup.sh b/startup.sh index 621fb8514..54ec88e30 100755 --- a/startup.sh +++ b/startup.sh @@ -13,11 +13,10 @@ if [[ $1 == "--live" ]] ; then set_env "gov.uk" export GOVUK_PROXY_STATIC_ENABLED=true export PLEK_SERVICE_STATIC_URI=${PLEK_SERVICE_STATIC_URI-https://assets.publishing.service.gov.uk} + ./bin/dev else echo "ERROR: other startup modes are not supported" echo "" echo "https://docs.publishing.service.gov.uk/manual/local-frontend-development.html" exit 1 fi - -bundle exec rails s -p 3090 From f1d96cd6fc3c66a7d367270795ebb7950af73ecd Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Mon, 25 Sep 2023 13:10:04 +0100 Subject: [PATCH 4/5] Delete unused Sass config --- config/environments/production.rb | 4 ---- 1 file changed, 4 deletions(-) diff --git a/config/environments/production.rb b/config/environments/production.rb index 7796a4289..6379ddf10 100644 --- a/config/environments/production.rb +++ b/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" From d738a714ec7415cab5351ad59737186cd4c2926a Mon Sep 17 00:00:00 2001 From: Jon Kirwan <87758239+jon-kirwan@users.noreply.github.com> Date: Thu, 31 Aug 2023 11:18:17 +0100 Subject: [PATCH 5/5] Fix globbing issue --- .../stylesheets/views/_service_manual_guide.scss | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/views/_service_manual_guide.scss b/app/assets/stylesheets/views/_service_manual_guide.scss index 23d3c4814..10d0dbb4f 100644 --- a/app/assets/stylesheets/views/_service_manual_guide.scss +++ b/app/assets/stylesheets/views/_service_manual_guide.scss @@ -1,5 +1,17 @@ @import "govuk_publishing_components/individual_component_support"; -@import "../modules/*"; +@import "../modules/change-history"; +@import "../modules/collection"; +@import "../modules/community-contact"; +@import "../modules/govspeak-wrapper"; +@import "../modules/hero"; +@import "../modules/notice"; +@import "../modules/page-contents"; +@import "../modules/page-header"; +@import "../modules/panel"; +@import "../modules/related-content"; +@import "../modules/service-standard-point"; +@import "../modules/sticky"; +@import "../modules/typography"; .js-enabled { .app-change-history__past {