Refactor module (loader) rules

- Removed unnecessary url-loader targeting .woff files
- Replaced file-loader with url-loader (file is fallback for url)
- PostCSS plugins are all loaded manually vs postcss.config.js

package-lock.json

@@ -154,8 +154,7 @@
     "ansi-styles": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
-      "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A=",
+      "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
-      "dev": true
     },
     "anymatch": {
       "version": "1.3.0",
@@ -792,8 +791,7 @@
     "chalk": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-      "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g==",
+      "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
-      "dev": true
     },
     "chokidar": {
       "version": "1.7.0",
@@ -930,8 +928,7 @@
     "color-convert": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
-      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o=",
+      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o="
-      "dev": true
     },
     "color-diff": {
       "version": "0.1.7",
@@ -942,8 +939,7 @@
     "color-name": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz",
-      "integrity": "sha1-XIq3K2S9IhXWF66VWeuxSEdc+Y0=",
+      "integrity": "sha1-XIq3K2S9IhXWF66VWeuxSEdc+Y0="
-      "dev": true
     },
     "color-string": {
       "version": "0.3.0",
@@ -2127,9 +2123,9 @@
       }
     },
     "enhanced-resolve": {
-      "version": "3.2.0",
+      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.2.0.tgz",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
-      "integrity": "sha512-Vlr4UydY821fadrNdW00y4FwebPe6TnD9dK0HhwhsqXEVpVCZnlZiGMcysrLT0+zENzA5Q/k9NCTXW0qbNRsxg==",
+      "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg==",
       "dev": true
     },
     "entities": {
@@ -2195,8 +2191,7 @@
     "escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
-      "dev": true
     },
     "escodegen": {
       "version": "1.8.1",
@@ -3863,8 +3858,7 @@
     "has-flag": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-      "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE=",
+      "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
-      "dev": true
     },
     "has-gulplog": {
       "version": "0.1.0",
@@ -3885,9 +3879,9 @@
       "dev": true
     },
     "hash.js": {
-      "version": "1.1.2",
+      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.2.tgz",
+      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.3.tgz",
-      "integrity": "sha512-SsNl8Ro2uz5xUTRYq8ysWzX8B7jCj7pLvX3opktaI6ZrTT2YElqjFVJXHJZe+5Aby20c9UC7elCjJDe1dhTaAw==",
+      "integrity": "sha512-/UETyP0W22QILqS+6HowevwhEFJ3MBJnwTf75Qob9Wz9t0DPuisL8kW8YZMK62dHAKE1c1p+gY1TtOLY+USEHA==",
       "dev": true
     },
     "hawk": {
@@ -5566,32 +5560,6 @@
       "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU=",
       "dev": true
     },
-    "optimize-css-assets-webpack-plugin": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-2.0.0.tgz",
-      "integrity": "sha1-UcrnEjDskaTBV2SXFeR0mODLRgs=",
-      "dev": true,
-      "dependencies": {
-        "source-list-map": {
-          "version": "0.1.8",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
-          "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY=",
-          "dev": true
-        },
-        "underscore": {
-          "version": "1.8.3",
-          "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.8.3.tgz",
-          "integrity": "sha1-Tz+1OxBuYJf8+ctBCfKl6b36UCI=",
-          "dev": true
-        },
-        "webpack-sources": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz",
-          "integrity": "sha1-qh86vw8NdNtxEcQOUAuE+WZkB1A=",
-          "dev": true
-        }
-      }
-    },
     "optionator": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
@@ -5853,8 +5821,7 @@
     "postcss": {
       "version": "6.0.4",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.4.tgz",
-      "integrity": "sha1-VzrN33P0LsskqmGNQO49WnwEplQ=",
+      "integrity": "sha1-VzrN33P0LsskqmGNQO49WnwEplQ="
-      "dev": true
     },
     "postcss-calc": {
       "version": "5.3.1",
@@ -7088,6 +7055,11 @@
       "integrity": "sha1-Kcy8fDfe36wwTp//C/FZaz9qDk4=",
       "dev": true
     },
+    "postcss-safe-parser": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-3.0.0.tgz",
+      "integrity": "sha1-AhTXOut22okyMH2To3oZMuhBJNM="
+    },
     "postcss-scss": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-0.4.1.tgz",
@@ -8105,8 +8077,7 @@
     "source-map": {
       "version": "0.5.6",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-      "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI=",
+      "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
-      "dev": true
     },
     "source-map-resolve": {
       "version": "0.3.1",
@@ -8601,8 +8572,7 @@
     "supports-color": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.1.0.tgz",
-      "integrity": "sha1-kswUuz2tiSjKVlbDPhmhnyCvXHo=",
+      "integrity": "sha1-kswUuz2tiSjKVlbDPhmhnyCvXHo="
-      "dev": true
     },
     "svg-tags": {
       "version": "1.0.0",

package.json

@@ -80,8 +80,10 @@
     "build:profile": "webpack --progress --profile --json --config resources/assets/build/webpack.config.js",
     "start": "webpack --hide-modules --watch --config resources/assets/build/webpack.config.js",
     "rmdist": "rimraf dist",
-    "lint": "eslint resources/assets/scripts resources/assets/build",
+    "lint": "npm run -s lint:scripts && npm run -s lint:styles",
-    "test": "npm run lint"
+    "lint:scripts": "eslint resources/assets/scripts resources/assets/build",
+    "lint:styles": "stylelint resources/assets/styles/**/*.{css,sass,scss,sss,less}",
+    "test": "npm run -s lint"
   },
   "engines": {
     "node": ">= 6.9.4"
@@ -105,8 +107,8 @@
     "imagemin-webpack-plugin": "~1.5.0-beta.0",
     "import-glob": "~1.5",
     "node-sass": "~4.5",
-    "optimize-css-assets-webpack-plugin": "~2.0",
     "postcss-loader": "~2.0",
+    "postcss-safe-parser": "^3.0.0",
     "resolve-url-loader": "~2.1",
     "rimraf": "~2.6",
     "sass-loader": "~6.0",

resources/assets/build/config.js

@@ -35,6 +35,10 @@ module.exports = merge(config, {
   manifest: {},
 });
 
+if (process.env.NODE_ENV === undefined) {
+  process.env.NODE_ENV = isProduction ? 'production' : 'development';
+}
+
 /**
  * If your publicPath differs between environments, but you know it at compile time,
  * then set SAGE_DIST_PATH as an environment variable before compiling.

resources/assets/build/postcss.config.js

@@ -0,0 +1,15 @@
+/* eslint-disable */
+
+const cssnanoConfig = {
+  preset: ['default', { discardComments: { removeAll: true } }]
+};
+
+module.exports = ({ file, options }) => {
+  return {
+    parser: options.enabled.optimize ? 'postcss-safe-parser' : undefined,
+    plugins: {
+      cssnano: options.enabled.optimize ? cssnanoConfig : false,
+      autoprefixer: true,
+    },
+  };
+};

resources/assets/build/webpack.config.js

@@ -2,12 +2,11 @@
 
 const webpack = require('webpack');
 const merge = require('webpack-merge');
-const autoprefixer = require('autoprefixer');
 const CleanPlugin = require('clean-webpack-plugin');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const StyleLintPlugin = require('stylelint-webpack-plugin');
-
 const CopyGlobsPlugin = require('copy-globs-webpack-plugin');
+
 const config = require('./config');
 
 const assetsFilenames = (config.enabled.cacheBusting) ? config.cacheBusting : '[name]';
@@ -50,8 +49,8 @@ let webpackConfig = {
             { loader: 'css', options: { sourceMap: config.enabled.sourceMaps } },
             {
               loader: 'postcss', options: {
+                config: { path: __dirname, ctx: config },
                 sourceMap: config.enabled.sourceMaps,
-                plugins: [autoprefixer()],
               },
             },
           ],
@@ -66,8 +65,8 @@ let webpackConfig = {
             { loader: 'css', options: { sourceMap: config.enabled.sourceMaps } },
             {
               loader: 'postcss', options: {
+                config: { path: __dirname, ctx: config },
                 sourceMap: config.enabled.sourceMaps,
-                plugins: [autoprefixer()],
               },
             },
             { loader: 'resolve-url', options: { sourceMap: config.enabled.sourceMaps } },
@@ -78,16 +77,18 @@ let webpackConfig = {
       {
         test: /\.(ttf|eot|woff2?|png|jpe?g|gif|svg|ico)$/,
         include: config.paths.assets,
-        loader: 'file',
+        loader: 'url',
         options: {
+          limit: 4096,
           name: `[path]${assetsFilenames}.[ext]`,
         },
       },
       {
         test: /\.(ttf|eot|woff2?|png|jpe?g|gif|svg|ico)$/,
         include: /node_modules|bower_components/,
-        loader: 'file',
+        loader: 'url',
         options: {
+          limit: 4096,
           publicPath: '../',
           name: `vendor/${config.cacheBusting}.[ext]`,
         },

resources/assets/build/webpack.config.optimize.js

@@ -1,23 +1,12 @@
 'use strict'; // eslint-disable-line
 
-const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
 const { default: ImageminPlugin } = require('imagemin-webpack-plugin');
 const imageminMozjpeg = require('imagemin-mozjpeg');
-const cssnano = require('cssnano');
 
 const config = require('./config');
 
 module.exports = {
   plugins: [
-    new OptimizeCssAssetsPlugin({
-      cssProcessor: cssnano,
-      cssProcessorOptions: {
-        discardComments: { removeAll: true },
-        autoprefixer: {},
-        safe: true,
-      },
-      canPrint: true,
-    }),
     new ImageminPlugin({
       optipng: { optimizationLevel: 7 },
       gifsicle: { optimizationLevel: 3 },

yarn.lock

@@ -1732,8 +1732,8 @@ engine.io@1.8.0:
     ws "1.1.1"
 
 enhanced-resolve@^3.0.0:
-  version "3.2.0"
+  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-3.2.0.tgz#7b60300c98e155a9caa06bf4550ec010bf74f6f8"
+  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz#950964ecc7f0332a42321b673b38dc8ff15535b3"
   dependencies:
     graceful-fs "^4.1.2"
     memory-fs "^0.4.0"
@@ -2632,8 +2632,8 @@ hash-base@^2.0.0:
     inherits "^2.0.1"
 
 hash.js@^1.0.0, hash.js@^1.0.3:
-  version "1.1.2"
+  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.2.tgz#bf5c887825cfe40b9efde7bf11bd2db26e6bf01b"
+  resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.3.tgz#340dedbe6290187151c1ea1d777a3448935df846"
   dependencies:
     inherits "^2.0.3"
     minimalistic-assert "^1.0.0"
@@ -4132,13 +4132,6 @@ opn@4.0.2:
     object-assign "^4.0.1"
     pinkie-promise "^2.0.0"
 
-optimize-css-assets-webpack-plugin@~2.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-2.0.0.tgz#51cae71230ec91a4c157649715e47498e0cb460b"
-  dependencies:
-    underscore "^1.8.3"
-    webpack-sources "^0.1.0"
-
 optionator@^0.8.1, optionator@^0.8.2:
   version "0.8.2"
   resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.2.tgz#364c5e409d3f4d6301d6c0b4c05bba50180aeb64"
@@ -4857,6 +4850,12 @@ postcss-resolve-nested-selector@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz#29ccbc7c37dedfac304e9fff0bf1596b3f6a0e4e"
 
+postcss-safe-parser@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-safe-parser/-/postcss-safe-parser-3.0.0.tgz#0214d73aeb76da8932307d93a37a1932e84124d3"
+  dependencies:
+    postcss "^6.0.1"
+
 postcss-scss@^0.4.0:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-0.4.1.tgz#ad771b81f0f72f5f4845d08aa60f93557653d54c"
@@ -5611,7 +5610,7 @@ sort-keys@^1.0.0:
   dependencies:
     is-plain-obj "^1.0.0"
 
-source-list-map@^0.1.7, source-list-map@~0.1.7:
+source-list-map@^0.1.7:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/source-list-map/-/source-list-map-0.1.8.tgz#c550b2ab5427f6b3f21f5afead88c4f5587b2106"
 
@@ -6219,10 +6218,6 @@ underscore@1.7.x:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.7.0.tgz#6bbaf0877500d36be34ecaa584e0db9fef035209"
 
-underscore@^1.8.3:
-  version "1.8.3"
-  resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.8.3.tgz#4f3fb53b106e6097fcf9cb4109f2a5e9bdfa5022"
-
 uniq@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/uniq/-/uniq-1.0.1.tgz#b31c5ae8254844a3a8281541ce2b04b865a734ff"
@@ -6449,13 +6444,6 @@ webpack-sources@1.0.1, webpack-sources@^1.0.1:
     source-list-map "^2.0.0"
     source-map "~0.5.3"
 
-webpack-sources@^0.1.0:
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/webpack-sources/-/webpack-sources-0.1.5.tgz#aa1f3abf0f0d74db7111c40e500b84f966640750"
-  dependencies:
-    source-list-map "~0.1.7"
-    source-map "~0.5.3"
-
 webpack@*, webpack@~3.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/webpack/-/webpack-3.0.0.tgz#ee9bcebf21247f7153cb410168cab45e3a59d4d7"