feat: STRF-11834 Consolidate css assembing logic (bigcommerce#1231)

lib/css/compile.js

@@ -1,8 +1,5 @@
 const path = require('path');
 const StencilStyles = require('@bigcommerce/stencil-styles');
-const { promisify } = require('util');
-
-const cssAssembler = require('../css-assembler');
 
 const SASS_ENGINE_NAME = 'node-sass';
 
@@ -11,10 +8,11 @@ const compile = async (configuration, themeAssetsPath, fileName, engineName = SA
     const ext = configuration.css_compiler === 'css' ? configuration.css_compiler : 'scss';
     const pathToFile = path.join(fileParts.dir, `${fileParts.name}.${ext}`);
     const basePath = path.join(themeAssetsPath, `${ext}`);
+    const stencilStyles = new StencilStyles(console);
 
     let files;
     try {
-        files = await promisify(cssAssembler.assemble)(pathToFile, basePath, `${ext}`, {});
+        files = await stencilStyles.assembleCssFiles(pathToFile, basePath, `${ext}`, {});
     } catch (err) {
         console.error(err);
         throw err;
@@ -31,7 +29,6 @@ const compile = async (configuration, themeAssetsPath, fileName, engineName = SA
             overrideBrowserslist: configuration.autoprefixer_browsers,
         },
     };
-    const stencilStyles = new StencilStyles(console);
     stencilStyles.activateEngine(engineName);
 
     return stencilStyles.compileCss('scss', params);

lib/stencil-bundle.js

@@ -4,11 +4,11 @@ const async = require('async');
 const crypto = require('crypto');
 const fs = require('fs');
 const path = require('path');
+const StencilStyles = require('@bigcommerce/stencil-styles');
 
 const BuildConfigManager = require('./BuildConfigManager');
 const BundleValidator = require('./bundle-validator');
 const Cycles = require('./Cycles');
-const cssAssembler = require('./css-assembler');
 const langAssembler = require('./lang-assembler');
 const templateAssembler = require('./template-assembler');
 const { recursiveReadDir } = require('./utils/fsUtils');
@@ -37,6 +37,8 @@ const PATHS_TO_ZIP = [
     { pattern: 'webpack.*.js' },
 ];
 
+const stencilStyles = new StencilStyles();
+
 class Bundle {
     constructor(
         themePath,
@@ -126,13 +128,12 @@ class Bundle {
                 });
                 async.map(
                     filterFiles,
-                    (file, mapCallback) => {
-                        cssAssembler.assemble(
+                    async (file) => {
+                        return stencilStyles.assembleCssFiles(
                             file,
                             basePath,
                             compiler,
                             assembleOptions,
-                            mapCallback,
                         );
                     },
                     (assemblingError, results) => {

package.json

@@ -49,7 +49,7 @@
   ],
   "dependencies": {
     "@bigcommerce/stencil-paper": "5.0.0",
-    "@bigcommerce/stencil-styles": "5.3.3",
+    "@bigcommerce/stencil-styles": "^6.1.1",
     "@hapi/boom": "^10.0.0",
     "@hapi/glue": "^8.0.0",
     "@hapi/h2o2": "^9.1.0",