From b7241d6306597d7231158d1e6e0b914a77c4cadd Mon Sep 17 00:00:00 2001 From: Dawn Budge Date: Tue, 21 May 2024 17:51:14 +0100 Subject: [PATCH] feat!(build-sass): support sass-embedded --- package-lock.json | 450 +++++++++++++++++++++--- package.json | 5 +- packages/dotcom-build-sass/README.md | 5 +- packages/dotcom-build-sass/package.json | 5 +- packages/dotcom-build-sass/src/index.ts | 23 +- 5 files changed, 421 insertions(+), 67 deletions(-) diff --git a/package-lock.json b/package-lock.json index bdac631f6..d396fcaf7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -50,8 +50,9 @@ "react": "^17.0.2", "react-dom": "^17.0.2", "react-test-renderer": "^17.0.2", - "sass": "^1.25.0", - "sass-loader": "^8.0.0", + "sass": "^1.77.2", + "sass-embedded": "^1.77.2", + "sass-loader": "^10.5.2", "style-loader": "^1.0.0", "supertest": "^4.0.2", "ts-jest": "^27.1.4", @@ -2200,6 +2201,11 @@ "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==", "dev": true }, + "node_modules/@bufbuild/protobuf": { + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-1.9.0.tgz", + "integrity": "sha512-W7gp8Q/v1NlCZLsv8pQ3Y0uCu/SHgXOVFK+eUluUKWXmsb6VHkpNx0apdOWWcDbB9sJoKeP8uPrjmehJz6xETQ==" + }, "node_modules/@cnakazawa/watch": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.4.tgz", @@ -10409,6 +10415,11 @@ "isarray": "^1.0.0" } }, + "node_modules/buffer-builder": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/buffer-builder/-/buffer-builder-0.2.0.tgz", + "integrity": "sha512-7VPMEPuYznPSoR21NE1zvd2Xna6c/CloiZCfcMXR1Jny6PjX0N4Nsa38zcBFo/FMK+BlA+FLKbJCQ0i2yxp+Xg==" + }, "node_modules/buffer-crc32": { "version": "0.2.13", "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz", @@ -11258,6 +11269,7 @@ "version": "4.0.1", "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz", "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==", + "dev": true, "dependencies": { "is-plain-object": "^2.0.4", "kind-of": "^6.0.2", @@ -27922,7 +27934,6 @@ "version": "7.8.1", "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", - "dev": true, "dependencies": { "tslib": "^2.1.0" } @@ -28289,9 +28300,9 @@ } }, "node_modules/sass": { - "version": "1.69.5", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.69.5.tgz", - "integrity": "sha512-qg2+UCJibLr2LCVOt3OlPhr/dqVHWOa9XtZf2OjbLs/T4VPSJ00udtgJxH3neXZm+QqX8B+3cU7RaLqp1iVfcQ==", + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.2.tgz", + "integrity": "sha512-eb4GZt1C3avsX3heBNlrc7I09nyT00IUuo4eFhAbeXWU2fvA7oXI53SxODVAA+zgZCk9aunAZgO+losjR3fAwA==", "dependencies": { "chokidar": ">=3.0.0 <4.0.0", "immutable": "^4.0.0", @@ -28304,19 +28315,370 @@ "node": ">=14.0.0" } }, + "node_modules/sass-embedded": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.77.2.tgz", + "integrity": "sha512-luiDeWNZ0tKs1jCiSFbuz8wFVQxYqN+vh+yfm9v7kW42yPtwEF8+z2ROaDJluSUZ7vhFmsXuqoKg9qBxc7SCnw==", + "dependencies": { + "@bufbuild/protobuf": "^1.0.0", + "buffer-builder": "^0.2.0", + "immutable": "^4.0.0", + "rxjs": "^7.4.0", + "supports-color": "^8.1.1", + "varint": "^6.0.0" + }, + "engines": { + "node": ">=16.0.0" + }, + "optionalDependencies": { + "sass-embedded-android-arm": "1.77.2", + "sass-embedded-android-arm64": "1.77.2", + "sass-embedded-android-ia32": "1.77.2", + "sass-embedded-android-x64": "1.77.2", + "sass-embedded-darwin-arm64": "1.77.2", + "sass-embedded-darwin-x64": "1.77.2", + "sass-embedded-linux-arm": "1.77.2", + "sass-embedded-linux-arm64": "1.77.2", + "sass-embedded-linux-ia32": "1.77.2", + "sass-embedded-linux-musl-arm": "1.77.2", + "sass-embedded-linux-musl-arm64": "1.77.2", + "sass-embedded-linux-musl-ia32": "1.77.2", + "sass-embedded-linux-musl-x64": "1.77.2", + "sass-embedded-linux-x64": "1.77.2", + "sass-embedded-win32-arm64": "1.77.2", + "sass-embedded-win32-ia32": "1.77.2", + "sass-embedded-win32-x64": "1.77.2" + } + }, + "node_modules/sass-embedded-android-arm": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.77.2.tgz", + "integrity": "sha512-rMuIMZ/FstMrT9Y23LDgQGpCyfe3i10dJnmW+DVJ9Gqz4dR7qpysEBIQXU35mHVq8ppNZ0yGiFlFZTSiiVMdzQ==", + "cpu": [ + "arm" + ], + "optional": true, + "os": [ + "android" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-android-arm64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.77.2.tgz", + "integrity": "sha512-7DiFMros5iRYrkPlNqUBfzZ/DCgsI199pRF8xuBsPf9yuB8SLDOqvNk3QOnUCMAbpjW5VW1JgdfGFFlHTCnJQA==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "android" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-android-ia32": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-android-ia32/-/sass-embedded-android-ia32-1.77.2.tgz", + "integrity": "sha512-qN0laKrAjuvBLFdUogGz8jQlbHs6tgH91tKQeE7ZE4AO9zzDRlXtaEJP1x6B6AGVc8UOEkvQyR3Nej4qwWprhA==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "android" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-android-x64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.77.2.tgz", + "integrity": "sha512-HByqtC5g5hOaJenWs4Klx6gFEIZYx+IEFh5K56U+wB+jd6EU32Lrnbdxy1+i/p/kZrd+23HrVHQPv8zpmxucaw==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "android" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-darwin-arm64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.77.2.tgz", + "integrity": "sha512-0jkL/FwbAStqqxFSjHfhElEAWrKRRvFz2JeXOxskUdzMehDMv5LaewqSRCijyeKBO3KgurvndmSfrOizdU6WAw==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "darwin" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-darwin-x64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.77.2.tgz", + "integrity": "sha512-8Sy36IxOOFPWA5TdhC87SvOkrXUSis51CGKlIsM8yZISQiY9y8b+wrNJM1f3oHvs641xZBaeIuwibJXaY6hNBg==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "darwin" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-arm": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.77.2.tgz", + "integrity": "sha512-/gtCseBkGCBw61p6MG2BqeYy8rblffw2KXUzMKjo9Hlqj/KajWDk7j1B+mVnqrHOPB/KBbm8Ym/2ooCYpnMIkQ==", + "cpu": [ + "arm" + ], + "optional": true, + "os": [ + "linux" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-arm64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.77.2.tgz", + "integrity": "sha512-hlfNFu1IWHI0cOsbpFWPrJlx7IFZfXuI3iEhwa4oljM21y72E6tETUFmTr4f9Ka9qDLXkUxUoYaTH2SqGU9dDA==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-ia32": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-ia32/-/sass-embedded-linux-ia32-1.77.2.tgz", + "integrity": "sha512-JSIqGIeAKlrMw/oMFFFxZ10F3QUJVdjeGVI83h6mwNHTYgrX6PuOngcAYleIpYR5XicQgfueC5pPVPbP5CArBQ==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "linux" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-musl-arm": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.77.2.tgz", + "integrity": "sha512-LZTSnfHPlfvkdQ8orpnEUCEx40qhKpMjxN3Ggi8kgQqv5jvtqn0ECdWl0n4WI5CrlkmtdS3VeFcsf078bt/f8Q==", + "cpu": [ + "arm" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-musl-arm64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.77.2.tgz", + "integrity": "sha512-JQZuONuhIurKjc/qE9cTiJXSLixL8hGkalWN3LJHasYHVAU92QA/t8rv0T51vIzf/I2F59He3bapkPme60dwSw==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-musl-ia32": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-ia32/-/sass-embedded-linux-musl-ia32-1.77.2.tgz", + "integrity": "sha512-6F1GHBgPkcTXtfM0MK3PofozagNF8IawdfIG4RNzGeSZRhGBRgZLOS+vdre4xubTLSaa6xjbI47YfaD43z8URQ==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-musl-x64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.77.2.tgz", + "integrity": "sha512-8BiqLA1NJeN3rCaX6t747GWMMdH5YUFYuytXU8waDC/u+FSGoOHRxfrsB8BEWHVgSPDxhwZklanPCXXzbzB2lw==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-linux-x64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.77.2.tgz", + "integrity": "sha512-czQOxGOX4U47jW9k+cbFBgSt/6FVx2WGLPqPvrgDiEToLJdZyvzUqrkpqQYfJ6hN1koqatCPEpDrUZBcTPGUGg==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "linux" + ], + "bin": { + "sass": "dart-sass/sass" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-win32-arm64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.77.2.tgz", + "integrity": "sha512-NA+4Y5PO04YQGtKNCyLrUjQU2nijskVA3Er/UYGtx66BBlWZ/ttbnlk+dU05SF5Jhjb3HtThGGH1meb7pKA+OQ==", + "cpu": [ + "arm64" + ], + "optional": true, + "os": [ + "win32" + ], + "bin": { + "sass": "dart-sass/sass.bat" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-win32-ia32": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-win32-ia32/-/sass-embedded-win32-ia32-1.77.2.tgz", + "integrity": "sha512-/3hGz4GefhVuuUu2gSOdsxBYym5Di0co0tZbtiokCU/8VhYhcAQ3v2Lni49VV6OnsyJLb1nUx+rbpd8cKO1U4w==", + "cpu": [ + "ia32" + ], + "optional": true, + "os": [ + "win32" + ], + "bin": { + "sass": "dart-sass/sass.bat" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded-win32-x64": { + "version": "1.77.2", + "resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.77.2.tgz", + "integrity": "sha512-joHLDICWmnR9Ca+LT9B+Fp85sCvV9F3gdtHtXLSuQAEulG5Ip1Z9euB3FUw+Z0s0Vz4MjNea+JD+TwO9eMrpyw==", + "cpu": [ + "x64" + ], + "optional": true, + "os": [ + "win32" + ], + "bin": { + "sass": "dart-sass/sass.bat" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-embedded/node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "engines": { + "node": ">=8" + } + }, + "node_modules/sass-embedded/node_modules/supports-color": { + "version": "8.1.1", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz", + "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==", + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/supports-color?sponsor=1" + } + }, "node_modules/sass-loader": { - "version": "8.0.2", - "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.2.tgz", - "integrity": "sha512-7o4dbSK8/Ol2KflEmSco4jTjQoV988bM82P9CZdmo9hR3RLnvNc0ufMNdMrB0caq38JQ/FgF4/7RcbcfKzxoFQ==", + "version": "10.5.2", + "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.5.2.tgz", + "integrity": "sha512-vMUoSNOUKJILHpcNCCyD23X34gve1TS7Rjd9uXHeKqhvBG39x6XbswFDtpbTElj6XdMFezoWhkh5vtKudf2cgQ==", "dependencies": { - "clone-deep": "^4.0.1", - "loader-utils": "^1.2.3", - "neo-async": "^2.6.1", - "schema-utils": "^2.6.1", - "semver": "^6.3.0" + "klona": "^2.0.4", + "loader-utils": "^2.0.0", + "neo-async": "^2.6.2", + "schema-utils": "^3.0.0", + "semver": "^7.3.2" }, "engines": { - "node": ">= 8.9.0" + "node": ">= 10.13.0" }, "funding": { "type": "opencollective", @@ -28324,7 +28686,7 @@ }, "peerDependencies": { "fibers": ">= 3.1.0", - "node-sass": "^4.0.0", + "node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0", "sass": "^1.3.0", "webpack": "^4.36.0 || ^5.0.0" }, @@ -28340,45 +28702,15 @@ } } }, - "node_modules/sass-loader/node_modules/json5": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz", - "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==", - "dependencies": { - "minimist": "^1.2.0" - }, + "node_modules/sass-loader/node_modules/semver": { + "version": "7.6.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz", + "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==", "bin": { - "json5": "lib/cli.js" - } - }, - "node_modules/sass-loader/node_modules/loader-utils": { - "version": "1.4.2", - "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz", - "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==", - "dependencies": { - "big.js": "^5.2.2", - "emojis-list": "^3.0.0", - "json5": "^1.0.1" - }, - "engines": { - "node": ">=4.0.0" - } - }, - "node_modules/sass-loader/node_modules/schema-utils": { - "version": "2.7.1", - "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.1.tgz", - "integrity": "sha512-SHiNtMOUGWBQJwzISiVYKu82GiV4QYGePp3odlY1tuKO7gPtphAT5R/py0fA6xtbgLL/RvtJZnU9b8s0F1q0Xg==", - "dependencies": { - "@types/json-schema": "^7.0.5", - "ajv": "^6.12.4", - "ajv-keywords": "^3.5.2" + "semver": "bin/semver.js" }, "engines": { - "node": ">= 8.9.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/webpack" + "node": ">=10" } }, "node_modules/sass-mq": { @@ -28676,6 +29008,7 @@ "version": "3.0.1", "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz", "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==", + "dev": true, "dependencies": { "kind-of": "^6.0.2" }, @@ -31007,8 +31340,7 @@ "node_modules/tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", - "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==", - "dev": true + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" }, "node_modules/tsutils": { "version": "3.21.0", @@ -31957,6 +32289,11 @@ "spdx-expression-parse": "^3.0.0" } }, + "node_modules/varint": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/varint/-/varint-6.0.0.tgz", + "integrity": "sha512-cXEIW6cfr15lFv563k4GuVuW/fiwjknytD37jIOLSdSWuOI6WnO/oKwmP2FQTU2l01LP8/M5TSAJpzUaGe3uWg==" + }, "node_modules/vary": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz", @@ -33907,8 +34244,9 @@ "mini-css-extract-plugin": "^0.12.0", "postcss": "^8.4.20", "postcss-loader": "^4.0.0", - "sass": "^1.25.0", - "sass-loader": "^8.0.0", + "sass": "^1.77.2", + "sass-embedded": "^1.77.2", + "sass-loader": "^10.5.2", "webpack-fix-style-only-entries": "^0.5.0" }, "devDependencies": { diff --git a/package.json b/package.json index 6cc6a61f8..55bed19de 100644 --- a/package.json +++ b/package.json @@ -77,8 +77,9 @@ "react": "^17.0.2", "react-dom": "^17.0.2", "react-test-renderer": "^17.0.2", - "sass": "^1.25.0", - "sass-loader": "^8.0.0", + "sass": "^1.77.2", + "sass-embedded": "^1.77.2", + "sass-loader": "^10.5.2", "style-loader": "^1.0.0", "supertest": "^4.0.2", "ts-jest": "^27.1.4", diff --git a/packages/dotcom-build-sass/README.md b/packages/dotcom-build-sass/README.md index becfe30e3..fbf6d80a0 100644 --- a/packages/dotcom-build-sass/README.md +++ b/packages/dotcom-build-sass/README.md @@ -69,8 +69,11 @@ The CSS loader has `@import` and `url()` resolution disabled as these should be | Option | Type | Default | Description | |-------------------|----------|---------|--------------------------------------------------------------------| | `webpackImporter` | Boolean | `false` | See https://github.com/webpack-contrib/sass-loader#webpackimporter | -| `prependData` | String | `''` | See https://webpack.js.org/loaders/sass-loader/#prependdata | +| `additionalData` | String | `''` | https://webpack.js.org/loaders/sass-loader/#additionaldata | | `includePaths` | String[] | `[]` | See https://sass-lang.com/documentation/js-api#includepaths | +| `implementation` | `sass\|sass-embedded` | `sass` | See https://webpack.js.org/loaders/sass-loader/#implementation | + +`additionalData` replaces `prependData` as of sass-loader v9. `prependData` is still supported in this package, but is deprecated. ## Sass build monitoring diff --git a/packages/dotcom-build-sass/package.json b/packages/dotcom-build-sass/package.json index 5fdc99582..8caf2beb3 100644 --- a/packages/dotcom-build-sass/package.json +++ b/packages/dotcom-build-sass/package.json @@ -27,8 +27,9 @@ "cssnano": "^4.1.10", "mini-css-extract-plugin": "^0.12.0", "postcss-loader": "^4.0.0", - "sass": "^1.25.0", - "sass-loader": "^8.0.0", + "sass": "^1.77.2", + "sass-embedded": "^1.77.2", + "sass-loader": "^10.5.2", "webpack-fix-style-only-entries": "^0.5.0" }, "devDependencies": { diff --git a/packages/dotcom-build-sass/src/index.ts b/packages/dotcom-build-sass/src/index.ts index 8533336ae..129b2614b 100644 --- a/packages/dotcom-build-sass/src/index.ts +++ b/packages/dotcom-build-sass/src/index.ts @@ -4,19 +4,30 @@ import type webpack from 'webpack' export type TPluginOptions = { includePaths?: string[] - prependData?: string + prependData?: string // DEPRECATED IN FAVOUR OF additionalData + additionalData?: string webpackImporter?: boolean + implementation?: 'sass' | 'sass-embedded' } export class PageKitSassPlugin { includePaths: string[] - prependData: string + prependData: string // DEPRECATED IN FAVOUR OF additionalData + additionalData: string webpackImporter: boolean + implementation: 'sass' | 'sass-embedded' - constructor({ includePaths = [], prependData = '', webpackImporter }: TPluginOptions = {}) { + constructor({ + includePaths = [], + prependData = '', + additionalData = '', + webpackImporter, + implementation = 'sass' + }: TPluginOptions = {}) { this.includePaths = includePaths - this.prependData = prependData + this.additionalData = additionalData.length ? additionalData : prependData this.webpackImporter = webpackImporter + this.implementation = implementation } apply(compiler: webpack.Compiler) { @@ -25,11 +36,11 @@ export class PageKitSassPlugin { // but we don't usually use this and disabling it can speed up builds by up to 20%. webpackImporter: this.webpackImporter, // Prefer `dart-sass`. - implementation: require('sass'), + implementation: require(this.implementation), // Prepends SCSS code before the actual entry file. // Introduced to maintain snappy grid after n-ui-foundations removed it as the default. // Once user-facing apps and components move away from using snappy grid then this can be removed. - prependData: this.prependData, + additionalData: this.additionalData, sassOptions: { // Disable formatting so that we don't spend time pretty printing outputStyle: 'compressed',