Optimize CSS build

build/css.js

@@ -0,0 +1,43 @@
+const postcssConfig = require('./postcss.config')
+const postcss = require('postcss')
+const glob = require('glob')
+const sass = require('node-sass')
+const cleancss = require('clean-css')
+const fs = require('fs')
+const path = require('path')
+const files = ['bootstrap', 'bootstrap-grid', 'bootstrap-reboot', 'bootstrap-utilities']
+
+files.forEach(filename => {
+  sass.render({
+    file: path.resolve(`./scss/${filename}.scss`),
+    outputStyle: 'expanded',
+    sourceMap: true,
+    sourceMapContents: true,
+    precision: 6,
+    outFile: `./dist/css/${filename}.css`
+  }, (error, css) => {
+    // Not sure what to do with css.map here
+    postcss(postcssConfig)
+      .process(css.css, { from: `./dist/css/${filename}.css` })
+      .then(result => {
+        fs.writeFile(`./dist/css/${filename}.css`, result.css, () => true)
+        fs.writeFile(`./dist/css/${filename}.min.css`, new cleancss().minify(result.css).styles, () => true)
+      })
+  })
+})
+
+// Autoprefix examples
+glob('./site/content/**/*.css', {}, (error, files) => {
+  files.forEach(file => {
+    fs.readFile(file, (err, css) => {
+
+      postcss(postcssConfig)
+        .process(css, { from: file, to: file })
+        .then(result => {
+          if (css.toString('utf8') !== result.css) {
+            fs.writeFile(file, result.css, () => true)
+          }
+        })
+    })
+  })
+})

build/postcss.config.js

@@ -2,13 +2,6 @@
 
 module.exports = ctx => {
   return {
-    map: ctx.file.dirname.includes('examples') ?
-      false :
-      {
-        inline: false,
-        annotation: true,
-        sourcesContent: true
-      },
     plugins: {
       autoprefixer: {
         cascade: false

package.json

@@ -20,18 +20,11 @@
   "scripts": {
     "start": "npm-run-all --parallel watch docs-serve",
     "bundlewatch": "bundlewatch --config .bundlewatch.config.json",
-    "css": "npm-run-all css-compile css-prefix css-rtl css-minify",
-    "css-compile": "sass --style expanded --source-map --embed-sources --no-error-css scss/:dist/css/",
+    "css": "node build/css.js",
     "css-rtl": "cross-env NODE_ENV=RTL postcss --config build/postcss.config.js --dir \"dist/css\" --ext \".rtl.css\" \"dist/css/*.css\" \"!dist/css/*.min.css\" \"!dist/css/*.rtl.css\"",
     "css-lint": "npm-run-all --continue-on-error --parallel css-lint-*",
     "css-lint-stylelint": "stylelint \"**/*.{css,scss}\" --cache --cache-location .cache/.stylelintcache --rd",
     "css-lint-vars": "fusv scss/ site/assets/scss/",
-    "css-minify": "npm-run-all --parallel css-minify-*",
-    "css-minify-main": "cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap.min.css dist/css/bootstrap.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-grid.min.css dist/css/bootstrap-grid.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-utilities.min.css dist/css/bootstrap-utilities.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-reboot.min.css dist/css/bootstrap-reboot.css",
-    "css-minify-rtl": "cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap.rtl.min.css dist/css/bootstrap.rtl.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-grid.rtl.min.css dist/css/bootstrap-grid.rtl.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-utilities.rtl.min.css dist/css/bootstrap-utilities.rtl.css && cleancss -O1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/bootstrap-reboot.rtl.min.css dist/css/bootstrap-reboot.rtl.css",
-    "css-prefix": "npm-run-all --parallel css-prefix-*",
-    "css-prefix-main": "postcss --config build/postcss.config.js --replace \"dist/css/*.css\" \"!dist/css/*.rtl*.css\" \"!dist/css/*.min.css\"",
-    "css-prefix-examples": "postcss --config build/postcss.config.js --replace \"site/content/**/*.css\"",
     "css-prefix-examples-rtl": "cross-env-shell NODE_ENV=RTL postcss --config build/postcss.config.js --dir \"site/content/docs/$npm_package_version_short/examples/\" --ext \".rtl.css\" --base \"site/content/docs/$npm_package_version_short/examples/\" \"site/content/docs/$npm_package_version_short/examples/{blog,carousel,dashboard,cheatsheet}/*.css\" \"!site/content/docs/$npm_package_version_short/examples/{blog,carousel,dashboard,cheatsheet}/*.rtl.css\"",
     "js": "npm-run-all js-compile js-minify",
     "js-compile": "npm-run-all --parallel js-compile-*",