init

platform/app/.webpack/rules/extractStyleChunks.js

@@ -0,0 +1,35 @@
+const ExtractCssChunksPlugin = require('extract-css-chunks-webpack-plugin');
+
+function extractStyleChunks(isProdBuild) {
+  return [
+    // If you are using the old stylus, you should uncomment this
+    // {
+    //   test: /\.styl$/,
+    //   use: [
+    //     {
+    //       loader: ExtractCssChunksPlugin.loader,
+    //       options: {
+    //         hot: !isProdBuild,
+    //       },
+    //     },
+    //     { loader: 'css-loader' },
+    //     { loader: 'stylus-loader' },
+    //   ],
+    // },
+    {
+      test: /\.(sa|sc|c)ss$/,
+      use: [
+        {
+          loader: ExtractCssChunksPlugin.loader,
+          options: {
+            hot: !isProdBuild,
+          },
+        },
+        'css-loader',
+        'postcss-loader',
+      ],
+    },
+  ];
+}
+
+module.exports = extractStyleChunks;

platform/app/.webpack/rules/fontsToJavaScript.js

@@ -0,0 +1,20 @@
+/**
+ * For CommonJS, we want to bundle whatever font we've landed on. This allows
+ * us to reduce the number of script-tags we need to specify for simple use.
+ *
+ * PWA will grab these externally to reduce bundle size (think code split),
+ * and cache the grab using service-worker.
+ */
+const fontsToJavaScript = {
+  test: /\.(ttf|eot|woff|woff2)$/i,
+  use: [
+    {
+      loader: 'file-loader',
+      options: {
+        name: '[name].[ext]',
+      },
+    },
+  ],
+};
+
+module.exports = fontsToJavaScript;