Add ts-loader

package.json

@@ -104,6 +104,7 @@
     "prop-types": "^15.8.1",
     "source-map-loader": "^4.0.1",
     "terser-webpack-plugin": "^5.3.9",
+    "ts-loader": "^9.4.4",
     "typescript": "^5.1.3",
     "webpack": "^5.82.1",
     "webpack-bundle-analyzer": "^4.8.0",

tsconfig.json

@@ -10,6 +10,7 @@
     "skipLibCheck": true,
     "resolveJsonModule": true,
     "allowSyntheticDefaultImports": true,
-    "allowJs": true
+    "allowJs": true,
+    "sourceMap": true
   }
 }

webpack.config.js

@@ -56,7 +56,7 @@ const config = {
     new ESLintPlugin({
       extensions: ["js", "mjs", "jsx", "ts", "tsx"],
       eslintPath: require.resolve("eslint"),
-      failOnError: !isProduction,
+      failOnError: true,
       cache: true,
     }),
     new MiniCssExtractPlugin({
@@ -102,6 +102,7 @@ const config = {
               ],
             },
           },
+          require.resolve("ts-loader")
         ],
       },
       {

yarn.lock

@@ -5154,7 +5154,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"enhanced-resolve@npm:^5.15.0":
+"enhanced-resolve@npm:^5.0.0, enhanced-resolve@npm:^5.15.0":
   version: 5.15.0
   resolution: "enhanced-resolve@npm:5.15.0"
   dependencies:
@@ -7693,7 +7693,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"micromatch@npm:^4.0.2, micromatch@npm:^4.0.4, micromatch@npm:^4.0.5":
+"micromatch@npm:^4.0.0, micromatch@npm:^4.0.2, micromatch@npm:^4.0.4, micromatch@npm:^4.0.5":
   version: 4.0.5
   resolution: "micromatch@npm:4.0.5"
   dependencies:
@@ -9586,7 +9586,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"semver@npm:^7.3.5, semver@npm:^7.5.4":
+"semver@npm:^7.3.4, semver@npm:^7.3.5, semver@npm:^7.5.4":
   version: 7.5.4
   resolution: "semver@npm:7.5.4"
   dependencies:
@@ -10041,6 +10041,7 @@ __metadata:
     semantic-sdp: ^3.26.2
     source-map-loader: ^4.0.1
     terser-webpack-plugin: ^5.3.9
+    ts-loader: ^9.4.4
     typescript: ^5.1.3
     usehooks-ts: ^2.9.1
     web-vitals: ^2.1.0
@@ -10434,6 +10435,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ts-loader@npm:^9.4.4":
+  version: 9.4.4
+  resolution: "ts-loader@npm:9.4.4"
+  dependencies:
+    chalk: ^4.1.0
+    enhanced-resolve: ^5.0.0
+    micromatch: ^4.0.0
+    semver: ^7.3.4
+  peerDependencies:
+    typescript: "*"
+    webpack: ^5.0.0
+  checksum: 8e5e6b839b0edfa40d2156c880d88ccab58226894ea5978221bc48c7db3215e2e856bfd0093f148e925a2befc42d6c94cafa9a994a7da274541efaa916012b63
+  languageName: node
+  linkType: hard
+
 "tslib@npm:2.5.0":
   version: 2.5.0
   resolution: "tslib@npm:2.5.0"