From b39d427957fc9f97b81ef3a99b21eec3d9a47cf3 Mon Sep 17 00:00:00 2001
From: Ollie Curtis <8831547+olliecurtis@users.noreply.github.com>
Date: Fri, 10 Jan 2025 12:24:11 +0000
Subject: [PATCH] [NO JIRA]: Update compliation of stylesheets (#3707)

---
 package.json                                           | 4 ++--
 packages/bpk-stylesheets/webpack.config.babel.js       | 3 +++
 scripts/transpilation/transform-js-scss-css-imports.js | 2 +-
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 3dc48bf5d8..d71ce7d17b 100644
--- a/package.json
+++ b/package.json
@@ -19,7 +19,7 @@
     "build": "run-s build:*",
     "build:gulp": "gulp",
     "build:unstable__bpk-mixins": "./scripts/scss/generate-unstable__bpk-mixins.sh",
-    "build:sass": "node scripts/scss/styles-prod.js && rm packages/bpk-stylesheets/index.css",
+    "build:sass": "node scripts/scss/styles-prod.js",
     "build:stylesheets": "(cd packages/bpk-stylesheets && node build)",
     "check-bpk-dependencies": "node scripts/npm/check-bpk-dependencies.js",
     "check-react-versions": "node scripts/npm/check-react-versions.js",
@@ -55,9 +55,9 @@
     "transpile:clean": "rm -rf ./dist",
     "transpile:js": "BABEL_ENV=dev babel packages --ignore ./packages/bpk-stylesheets --out-dir dist --extensions \".ts,.tsx,.js,.jsx\" --config-file ./babel.config.js",
     "transpile:dts": "tsc --project tsconfig.declaration.json",
-    "transpile:imports": "node scripts/transpilation/transform-js-scss-css-imports.js",
     "transpile:copy-css": "node scripts/transpilation/copy-css.js",
     "transpile:copy-utils": "node scripts/transpilation/copy-utils.js",
+    "transpile:imports": "node scripts/transpilation/transform-js-scss-css-imports.js",
     "transpile:copy-package-json": "cp ./packages/package.json ./dist/",
     "transpile:copy-readme": "cp packages/README.md ./dist/"
   },
diff --git a/packages/bpk-stylesheets/webpack.config.babel.js b/packages/bpk-stylesheets/webpack.config.babel.js
index 834141a6a8..42d5a7b420 100644
--- a/packages/bpk-stylesheets/webpack.config.babel.js
+++ b/packages/bpk-stylesheets/webpack.config.babel.js
@@ -123,5 +123,8 @@ module.exports = {
     new MiniCssExtractPlugin({
       filename: 'base.css',
     }),
+    new MiniCssExtractPlugin({
+      filename: 'index.css',
+    }),
   ],
 };
diff --git a/scripts/transpilation/transform-js-scss-css-imports.js b/scripts/transpilation/transform-js-scss-css-imports.js
index 6f851b460e..38c6f4a955 100644
--- a/scripts/transpilation/transform-js-scss-css-imports.js
+++ b/scripts/transpilation/transform-js-scss-css-imports.js
@@ -46,7 +46,7 @@ console.log('Crunching import paths...');
 // eslint-disable-next-line no-console
 console.log('');
 
-const findReplaces = [{ find: '.module.scss', replace: '.module.css' }];
+const findReplaces = [{ find: '.scss', replace: '.css' }];
 
 const jsFiles = execSync(
   'find dist -name "*.js" -o -name "*.jsx" -name "*.ts" -o -name "*.tsx" | grep -v node_modules',