Skip to content

Generate SCSS into individual CSS files within components_combined.

Alan Cole requested to merge feature/split-css into 1.0.x

An additional script splitcss.js was added to the npm run dist step. It runs after the existing webpack, and will build the SCSS files into their respective component folders, and adds a base.css to the components_combined/base folder for the core required styles for every component.

Some notes:

  • As this SCSS build is run independently of the webpack build, no loaders were used in the process - only features available in the npm sass package. This means any ~ imports have been replaced with a relative path to the file. (See breakpoint and reset).
  • Some mixins have been defined within a component scss file. This means if the mixin needs to be used elsewhere, it will double-import the selectors that also live with the mixin. For this reason, I have split out the mixins into the mixin folder, where we can be safe importing it without adding unwanted selectors. See background and button.
Edited by Alan Cole

Merge request reports