Add Fontsource Roboto node module

package-lock.json

@@ -12,6 +12,7 @@
         "@date-io/moment": "^1.3.11",
         "@emotion/react": "^11.8.2",
         "@emotion/styled": "^11.8.1",
+        "@fontsource/roboto": "^4.5.8",
         "@mui/icons-material": "^5.5.1",
         "@mui/lab": "^5.0.0-alpha.73",
         "@mui/material": "^5.5.1",
@@ -2392,6 +2393,11 @@
       "resolved": "https://registry.npmjs.org/@foliojs-fork/restructure/-/restructure-2.0.2.tgz",
       "integrity": "sha512-59SgoZ3EXbkfSX7b63tsou/SDGzwUEK6MuB5sKqgVK1/XE0fxmpsOb9DQI8LXW3KfGnAjImCGhhEb7uPPAUVNA=="
     },
+    "node_modules/@fontsource/roboto": {
+      "version": "4.5.8",
+      "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-4.5.8.tgz",
+      "integrity": "sha512-CnD7zLItIzt86q4Sj3kZUiLcBk1dSk81qcqgMGaZe7SQ1P8hFNxhMl5AZthK1zrDM5m74VVhaOpuMGIL4gagaA=="
+    },
     "node_modules/@formatjs/intl-unified-numberformat": {
       "version": "3.3.7",
       "resolved": "https://registry.npmjs.org/@formatjs/intl-unified-numberformat/-/intl-unified-numberformat-3.3.7.tgz",
@@ -17231,6 +17237,11 @@
       "resolved": "https://registry.npmjs.org/@foliojs-fork/restructure/-/restructure-2.0.2.tgz",
       "integrity": "sha512-59SgoZ3EXbkfSX7b63tsou/SDGzwUEK6MuB5sKqgVK1/XE0fxmpsOb9DQI8LXW3KfGnAjImCGhhEb7uPPAUVNA=="
     },
+    "@fontsource/roboto": {
+      "version": "4.5.8",
+      "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-4.5.8.tgz",
+      "integrity": "sha512-CnD7zLItIzt86q4Sj3kZUiLcBk1dSk81qcqgMGaZe7SQ1P8hFNxhMl5AZthK1zrDM5m74VVhaOpuMGIL4gagaA=="
+    },
     "@formatjs/intl-unified-numberformat": {
       "version": "3.3.7",
       "resolved": "https://registry.npmjs.org/@formatjs/intl-unified-numberformat/-/intl-unified-numberformat-3.3.7.tgz",

package.json

@@ -27,6 +27,7 @@
     "@date-io/moment": "^1.3.11",
     "@emotion/react": "^11.8.2",
     "@emotion/styled": "^11.8.1",
+    "@fontsource/roboto": "^4.5.8",
     "@mui/icons-material": "^5.5.1",
     "@mui/lab": "^5.0.0-alpha.73",
     "@mui/material": "^5.5.1",

src/client/index.html

@@ -9,7 +9,6 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="description" content="" />
   <meta name="robots" content="noindex">
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" />
   <title></title>
 </head>
 

src/client/index.js

@@ -15,6 +15,10 @@ import '@nosferatu500/react-sortable-tree/style.css'
 import 'react-redux-toastr/lib/css/react-redux-toastr.min.css'
 import 'mapbox-gl/dist/mapbox-gl.css'
 import portalConfig from '../configs/portalConfig.json'
+import '@fontsource/roboto/300.css'
+import '@fontsource/roboto/400.css'
+import '@fontsource/roboto/500.css'
+import '@fontsource/roboto/700.css'
 
 const { localeConfig, layoutConfig } = portalConfig
 const store = configureStore()

webpack.client.common.js

@@ -62,6 +62,13 @@ module.exports = {
         options: {
           outputPath: 'images'
         }
+      },
+      {
+        test: /\.(woff2|woff|eot|ttf)$/,
+        loader: 'file-loader',
+        options: {
+          name: 'fonts/[name].[ext]'
+        }
       }
     ]
   },