refactor(fonts): include fontawesome as scss

frontend/src/app.js

@@ -7,10 +7,7 @@ import { isValidUtility } from './core/utility';
 // load window.fetch polyfill
 import 'whatwg-fetch';
 
-import '@fortawesome/fontawesome-pro/css/all.css';
+import './app.scss';
-
-import 'typeface-roboto/index.css';
-import 'typeface-source-sans-pro/index.css';
 
 export class App {
   httpClient = new HttpClient();

frontend/src/app.scss

@@ -0,0 +1,11 @@
+$fa-font-path: "~@fortawesome/fontawesome-pro/webfonts";
+
+@import "@fortawesome/fontawesome-pro/scss/fontawesome.scss";
+@import "@fortawesome/fontawesome-pro/scss/solid.scss";
+
+
+$roboto: "Roboto";
+@import "~typeface-roboto/index.css";
+
+$source-sans: "Source Sans Pro";
+@import "~typeface-source-sans-pro/index.css";

records.json

@@ -527,5 +527,18 @@
         "usedIds": []
       }
     }
+  ],
+  "mini-css-extract-plugin node_modules/css-loader/dist/cjs.js??ref--6-1!node_modules/postcss-loader/src/index.js??ref--6-2!node_modules/sass-loader/dist/cjs.js??ref--6-3!frontend/src/app.scss": [
+    {
+      "modules": {
+        "byIdentifier": {},
+        "usedIds": {}
+      },
+      "chunks": {
+        "byName": {},
+        "bySource": {},
+        "usedIds": []
+      }
+    }
   ]
 }

webpack.config.js

@@ -52,7 +52,7 @@ module.exports = {
         use: [ MiniCssExtractPlugin.loader,
                { loader: 'css-loader', options: { sourceMap: true }},
                { loader: 'postcss-loader', options: { sourceMap: true }},
-               { loader: 'sass-loader', options: { sourceMap: true }}
+               { loader: 'sass-loader', options: { sourceMap: true, includePaths: [path.resolve(__dirname, 'node_modules')] }}
              ]
       },
       {
@@ -131,7 +131,9 @@ module.exports = {
       minChunks: 1,
       cacheGroups: {
         vendor: {
-          test: /[\\/]node_modules[\\/]/,
+          test(module, chunk) {
+            return module.context.match(/[\\/]node_modules[\\/]/);
+          },
           name(module, chunks, cacheGroupKey) {
             const moduleFileName = module.identifier().split('/').reduceRight(item => item);
             const allChunksNames = chunks.map((item) => item.name).join('~');