From 64aa942dc59a6ed50589b43100fb791ab099d796 Mon Sep 17 00:00:00 2001
From: "alex.saiannyi" <alexander.saiannyi@bigcommerce.com>
Date: Wed, 19 Jan 2022 22:42:38 +0200
Subject: [PATCH] fix(storefront): bctheme-1000 handle correctly regular css
 file

---
 .gitattributes                                     |  2 ++
 CHANGELOG.md                                       |  4 ++++
 lib/stencil-bundle.js                              | 12 ++++++++++--
 server/plugins/theme-assets/theme-assets.module.js | 10 +++++-----
 4 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/.gitattributes b/.gitattributes
index 863f3cb06..781690e25 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -1,2 +1,4 @@
 # Set a consistent line-ending styles across different OS to avoid problems with linters
 * text eol=lf
+*.png binary
+*.jpg binary
diff --git a/CHANGELOG.md b/CHANGELOG.md
index b85cd9260..dee20c25d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,7 @@
+### Draft
+
+-   fix(storefront): bctheme-1000 handle regular css in stencil ([845](https://github.com/bigcommerce/stencil-cli/pull/845))
+
 ### 3.9.2 (2022-01-31)
 
 -   chore: bump paper to latest ([863](https://github.com/bigcommerce/stencil-cli/pull/863))
diff --git a/lib/stencil-bundle.js b/lib/stencil-bundle.js
index 2990d4926..458af02a3 100644
--- a/lib/stencil-bundle.js
+++ b/lib/stencil-bundle.js
@@ -110,7 +110,12 @@ class Bundle {
             bundle: true,
         };
         return (callback) => {
-            const basePath = path.join(this.themePath, 'assets', compiler);
+            let basePath;
+            if (compiler === 'css') {
+                basePath = path.join(this.themePath, 'assets/dist', compiler);
+            } else {
+                basePath = path.join(this.themePath, 'assets', compiler);
+            }
 
             console.log('%s Parsing Started...', compiler.toUpperCase());
             fs.readdir(basePath, (err, files) => {
@@ -395,7 +400,10 @@ class Bundle {
                 case 'css':
                     // Create the parsed tree files
                     for (const [filename, data] of Object.entries(result)) {
-                        archiveJsonFile(data, `parsed/scss/${filename}.json`);
+                        archiveJsonFile(
+                            data,
+                            `parsed/${this.configuration.css_compiler}/${filename}.json`,
+                        );
                     }
                     break;
 
diff --git a/server/plugins/theme-assets/theme-assets.module.js b/server/plugins/theme-assets/theme-assets.module.js
index e3a4f0ea8..294a216e5 100644
--- a/server/plugins/theme-assets/theme-assets.module.js
+++ b/server/plugins/theme-assets/theme-assets.module.js
@@ -60,21 +60,21 @@ internals.cssHandler = async (request, h) => {
     request.app.themeConfig.setVariation(variationIndex);
 
     // Get the theme configuration
+    const configuration = await request.app.themeConfig.getConfig();
     const fileName = internals.getOriginalFileName(request.params.fileName);
     const fileParts = path.parse(fileName);
-    const pathToFile = path.join(fileParts.dir, `${fileParts.name}.scss`);
-    const basePath = path.join(internals.getThemeAssetsPath(), 'scss');
+    const ext = configuration.css_compiler === 'css' ? configuration.css_compiler : 'scss';
+    const pathToFile = path.join(fileParts.dir, `${fileParts.name}.${ext}`);
+    const basePath = path.join(internals.getThemeAssetsPath(), `${ext}`);
 
     let files;
     try {
-        files = await promisify(cssAssembler.assemble)(pathToFile, basePath, 'scss', {});
+        files = await promisify(cssAssembler.assemble)(pathToFile, basePath, `${ext}`, {});
     } catch (err) {
         console.error(err);
         throw Boom.badData(err);
     }
 
-    const configuration = await request.app.themeConfig.getConfig();
-
     const params = {
         data: files[pathToFile],
         files,