Fix linting errors

.eslintrc

@@ -106,7 +106,8 @@
     "prefer-const": "error",
     /* See https://stackoverflow.com/questions/64646248/eslintrc-js-for-react-17-and-jsx-without-import-react/64646593#64646593 */
     "react/jsx-uses-react": "off",
-    "react/react-in-jsx-scope": "off"
+    "react/react-in-jsx-scope": "off",
+    "react/no-unknown-property": ["error", { "ignore": ["css"] }]
   },
   "overrides": [
     {

buildprocess/configureWebpack.js

@@ -392,8 +392,8 @@ function configureWebpack(
             importLoaders: 2
           }
         },
-        { loader: "resolve-url-loader?sourceMap" },
-        { loader: "sass-loader?sourceMap" }
+        { loader: "resolve-url-loader", options: { sourceMap: true } },
+        { loader: "sass-loader", options: { sourceMap: true } }
       ]
     });
   } else if (MiniCssExtractPlugin) {
@@ -417,8 +417,8 @@ function configureWebpack(
             importLoaders: 2
           }
         },
-        { loader: "resolve-url-loader?sourceMap" },
-        { loader: "sass-loader?sourceMap" }
+        { loader: "resolve-url-loader", options: { sourceMap: true } },
+        { loader: "sass-loader", options: { sourceMap: true } }
       ]
     });
 

buildprocess/webpack-tools.config.js

@@ -32,7 +32,7 @@ module.exports = function () {
         ignoreOrder: true
       }),
       // This is needed for a jsdom issue
-      new IgnorePlugin(/canvas/, /jsdom$/)
+      new IgnorePlugin({ resourceRegExp: /canvas/, contextRegExp: /jsdom$/ })
     ]
   };
   return configureWebpackForTerriaJS(

lib/ReactViews/Map/Panels/DropdownPanel.jsx

@@ -99,7 +99,7 @@ const DropdownPanel = createReactClass({
           ref={
             this.props.btnRef || ((element) => (this.buttonElement = element))
           }
-          isOpen={this.isOpen()}
+          isOpen={this.isOpen()} /* eslint-disable-line  react/no-unknown-property*/
           css={`
             ${(p) =>
               p.isOpen &&

lib/ReactViews/Map/Panels/InnerPanel.jsx

@@ -139,6 +139,7 @@ const InnerPanel = createReactClass({
           onClick={this.forceClose}
           title={t("general.close")}
           aria-label={t("general.close")}
+          /* eslint-disable-next-line react/no-unknown-property*/
           showDropdownAsModal={this.props.showDropdownAsModal}
           css={`
             svg {

lib/ReactViews/Notification/NotificationWindow.jsx

@@ -73,7 +73,7 @@ const NotificationWindow = createReactClass({
       <div className={classNames(Styles.wrapper, `${type}`)}>
         <div
           className={Styles.notification}
-          isStory={isStory}
+          isStory={isStory} /* eslint-disable-line react/no-unknown-property */
           css={`
             background: ${(p) =>
               p.isStory ? p.theme.colorPrimary : p.theme.dark};

package.json

@@ -183,14 +183,15 @@
     "typescript": "~5.2.0",
     "urijs": "^1.18.12",
     "url-loader": "^1.1.2",
-    "webpack": "5",
+    "webpack": "^5.90.3",
     "webpack-cli": "^3.3.11",
     "webpack-dev-server": "^3.1.14",
     "worker-loader": "^2.0.0"
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.23.3",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
+    "@types/css-font-loading-module": "^0.0.13",
     "@types/dateformat": "^3.0.1",
     "@types/node": "^18.15.11",
     "@types/webpack": "4.41.33",