From 1308b5ed6c588e4dceb171cde0aab97d695abcee Mon Sep 17 00:00:00 2001
From: Juho Heikka <juho.heikka@gmail.com>
Date: Tue, 4 Apr 2023 09:36:02 +0300
Subject: [PATCH] Webpack config fixes (#7423)

Signed-off-by: Juho Heikka <juho.heikka@gmail.com>
---
 .../typescript/config/base.json               |  1 +
 packages/infrastructure/webpack/package.json  |  2 ++
 .../get-multi-export-config.test.js.snap      | 23 ++++++++++++++++
 .../webpack/src/get-react-config.js           | 26 ++++++++++++++++++-
 4 files changed, 51 insertions(+), 1 deletion(-)

diff --git a/packages/infrastructure/typescript/config/base.json b/packages/infrastructure/typescript/config/base.json
index 0c08f1391c..5662f2e055 100644
--- a/packages/infrastructure/typescript/config/base.json
+++ b/packages/infrastructure/typescript/config/base.json
@@ -17,6 +17,7 @@
     "noImplicitAny": true,
     "noUnusedLocals": true,
     "noImplicitReturns": true,
+    "experimentalDecorators": true,
     "isolatedModules": true,
     "skipLibCheck": true,
     "allowJs": false,
diff --git a/packages/infrastructure/webpack/package.json b/packages/infrastructure/webpack/package.json
index 6b59746e9e..a536e7dc16 100644
--- a/packages/infrastructure/webpack/package.json
+++ b/packages/infrastructure/webpack/package.json
@@ -27,8 +27,10 @@
     "css-loader": "^6.7.2",
     "fork-ts-checker-webpack-plugin": "^7.3.0",
     "mini-css-extract-plugin": "^2.7.3",
+    "sass": "^1.58.2",
     "sass-loader": "^13.2.0",
     "style-loader": "^3.3.1",
+    "tailwindcss": "^3.2.4",
     "ts-loader": "^9.4.1",
     "webpack": "^5.77.0",
     "webpack-cli": "^4.10.0",
diff --git a/packages/infrastructure/webpack/src/__snapshots__/get-multi-export-config.test.js.snap b/packages/infrastructure/webpack/src/__snapshots__/get-multi-export-config.test.js.snap
index 2db11a39ef..6ef31d9c23 100644
--- a/packages/infrastructure/webpack/src/__snapshots__/get-multi-export-config.test.js.snap
+++ b/packages/infrastructure/webpack/src/__snapshots__/get-multi-export-config.test.js.snap
@@ -157,6 +157,17 @@ Array [
                 "sourceMap": false,
               },
             },
+            Object {
+              "loader": "postcss-loader",
+              "options": Object {
+                "postcssOptions": Object {
+                  "plugins": Array [
+                    "tailwindcss",
+                  ],
+                },
+                "sourceMap": false,
+              },
+            },
             Object {
               "loader": "sass-loader",
               "options": Object {
@@ -165,6 +176,18 @@ Array [
             },
           ],
         },
+        Object {
+          "test": /\\\\\\.\\(ttf\\|eot\\|woff2\\?\\)\\$/,
+          "type": "asset/resource",
+        },
+        Object {
+          "test": /\\\\\\.svg\\$/,
+          "type": "asset/source",
+        },
+        Object {
+          "test": /\\\\\\.\\(jpg\\|png\\|ico\\)\\$/,
+          "type": "asset/resource",
+        },
       ],
     },
     "name": "./some-other-entrypoint/index.ts",
diff --git a/packages/infrastructure/webpack/src/get-react-config.js b/packages/infrastructure/webpack/src/get-react-config.js
index 6b83b6af86..b8be931329 100644
--- a/packages/infrastructure/webpack/src/get-react-config.js
+++ b/packages/infrastructure/webpack/src/get-react-config.js
@@ -8,7 +8,6 @@ module.exports =
       entrypointFilePath,
       outputDirectory,
     });
-
     return {
       ...nodeConfig,
 
@@ -46,6 +45,16 @@ module.exports =
                 },
               },
 
+              {
+                loader: "postcss-loader",
+                options: {
+                  sourceMap: false,
+                  postcssOptions: {
+                    plugins: ["tailwindcss"],
+                  },
+                },
+              },
+
               {
                 loader: "sass-loader",
                 options: {
@@ -54,6 +63,21 @@ module.exports =
               },
             ],
           },
+
+          {
+            test: /\.(ttf|eot|woff2?)$/,
+            type: "asset/resource",
+          },
+
+          {
+            test: /\.svg$/,
+            type: "asset/source", // exports the source code of the asset, so we get XML
+          },
+
+          {
+            test: /\.(jpg|png|ico)$/,
+            type: "asset/resource",
+          },
         ],
       },
     };