Webpack config fixes (#7423)

Signed-off-by: Juho Heikka <juho.heikka@gmail.com>

packages/infrastructure/typescript/config/base.json

@@ -17,6 +17,7 @@
     "noImplicitAny": true,
     "noUnusedLocals": true,
     "noImplicitReturns": true,
+    "experimentalDecorators": true,
     "isolatedModules": true,
     "skipLibCheck": true,
     "allowJs": false,

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",

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",

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",
+          },
         ],
       },
     };