Merge pull request #1136 from alphagov/switch-to-modern-sass-api

Switch to modern Sass API

Gemfile.lock

@@ -455,6 +455,7 @@ PLATFORMS
   arm64-darwin-21
   arm64-darwin-22
   arm64-darwin-23
+  arm64-darwin-24
   x86_64-darwin-20
   x86_64-darwin-21
   x86_64-darwin-22

app/frontend/entrypoints/application.scss

@@ -1,8 +1,7 @@
-$govuk-images-path: "@govuk/assets/images/";
-$govuk-fonts-path: "@govuk/assets/fonts/";
+$govuk-assets-path: "@govuk/assets/";
 $govuk-global-styles: true;
 
-@import "@govuk/all";
-@import "dfe-autocomplete/src/dfe-autocomplete";
+@import "pkg:govuk-frontend";
+@import "pkg:dfe-autocomplete/src/dfe-autocomplete";
 @import "../../components/form_header_component/";
 @import "../styles/app-panel";

vite.config.js

@@ -1,14 +1,16 @@
 import { defineConfig } from 'vite'
 import RubyPlugin from 'vite-plugin-ruby'
 import * as path from 'node:path'
+import { NodePackageImporter } from 'sass'
 
 export default defineConfig({
   plugins: [RubyPlugin()],
   build: { emptyOutDir: true },
   css: {
     preprocessorOptions: {
       scss: {
-        includePaths: ['./node_modules/govuk-frontend/'],
+        api: 'modern',
+        importers: [new NodePackageImporter()],
         quietDeps: true
       },
       devSourcemaps: true