add css loader

package.json

@@ -1,6 +1,7 @@
 {
   "dependencies": {
     "copy-webpack-plugin": "^5.1.1",
+    "css-loader": "^3.4.2",
     "elm-hot-webpack-loader": "^1.1.6",
     "elm-webpack-loader": "^6.0.1",
     "favicons-webpack-plugin": "^1.0.2",
@@ -11,7 +12,7 @@
     "prerender-spa-plugin": "^3.4.0",
     "style-loader": "^1.1.3",
     "tempy": "^0.3.0",
-    "terser-webpack-plugin": "^2.3.4",
+    "terser-webpack-plugin": "^2.3.5",
     "webpack": "^4.41.6",
     "webpack-cli": "^3.3.11",
     "webpack-dev-server": "^3.10.3",

pnpm-lock.yaml

@@ -1,5 +1,6 @@
 dependencies:
   copy-webpack-plugin: 5.1.1_webpack@4.41.6
+  css-loader: 3.4.2_webpack@4.41.6
   elm-hot-webpack-loader: 1.1.6_elm-webpack-loader@6.0.1
   elm-webpack-loader: 6.0.1
   favicons-webpack-plugin: 1.0.2_webpack@4.41.6
@@ -10,7 +11,7 @@ dependencies:
   prerender-spa-plugin: 3.4.0
   style-loader: 1.1.3_webpack@4.41.6
   tempy: 0.3.0
-  terser-webpack-plugin: 2.3.4_webpack@4.41.6
+  terser-webpack-plugin: 2.3.5_webpack@4.41.6
   webpack: 4.41.6_webpack@4.41.6
   webpack-cli: 3.3.11_webpack@4.41.6
   webpack-dev-server: 3.10.3_5f6d85193f762f49dce35a13b1851a83
@@ -1919,6 +1920,28 @@ packages:
       node: '>=4'
     resolution:
       integrity: sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4=
+  /css-loader/3.4.2_webpack@4.41.6:
+    dependencies:
+      camelcase: 5.3.1
+      cssesc: 3.0.0
+      icss-utils: 4.1.1
+      loader-utils: 1.2.3
+      normalize-path: 3.0.0
+      postcss: 7.0.26
+      postcss-modules-extract-imports: 2.0.0
+      postcss-modules-local-by-default: 3.0.2
+      postcss-modules-scope: 2.1.1
+      postcss-modules-values: 3.0.0
+      postcss-value-parser: 4.0.2
+      schema-utils: 2.6.4
+      webpack: 4.41.6_webpack@4.41.6
+    dev: false
+    engines:
+      node: '>= 8.9.0'
+    peerDependencies:
+      webpack: ^4.0.0 || ^5.0.0
+    resolution:
+      integrity: sha512-jYq4zdZT0oS0Iykt+fqnzVLRIeiPWhka+7BqPn+oSIpWJAHak5tmB/WZrJ2a21JhCeFyNnnlroSl8c+MtVndzA==
   /css-select-base-adapter/0.1.1:
     dev: false
     resolution:
@@ -1960,6 +1983,13 @@ packages:
       node: '>= 6'
     resolution:
       integrity: sha512-WwOrosiQTvyms+Ti5ZC5vGEK0Vod3FTt1ca+payZqvKuGJF+dq7bG63DstxtN0dpm6FxY27a/zS3Wten+gEtGw==
+  /cssesc/3.0.0:
+    dev: false
+    engines:
+      node: '>=4'
+    hasBin: true
+    resolution:
+      integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
   /csso/4.0.2:
     dependencies:
       css-tree: 1.0.0-alpha.37
@@ -3241,6 +3271,8 @@ packages:
     engines:
       node: '>=4.0'
     optional: true
+    os:
+      - darwin
     requiresBuild: true
     resolution:
       integrity: sha512-+ux3lx6peh0BpvY0JebGyZoiR4D+oYzdPZMKJwkZ+sFkNJzpL7tXc/wehS49gUAxg3tmMHPHZkA8JU2rhhgDHw==
@@ -3834,6 +3866,14 @@ packages:
       node: '>=0.10.0'
     resolution:
       integrity: sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==
+  /icss-utils/4.1.1:
+    dependencies:
+      postcss: 7.0.26
+    dev: false
+    engines:
+      node: '>= 6'
+    resolution:
+      integrity: sha512-4aFq7wvWyMHKgxsH8QQtGpvbASCf+eM3wPRLI6R+MgAnTCZ6STYsRvttLvRWK0Nfif5piF394St3HeJDaljGPA==
   /ieee754/1.1.13:
     dev: false
     resolution:
@@ -3984,6 +4024,10 @@ packages:
       node: '>=8'
     resolution:
       integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==
+  /indexes-of/1.0.1:
+    dev: false
+    resolution:
+      integrity: sha1-8w9xbI4r00bHtn0985FVZqfAVgc=
   /infer-owner/1.0.4:
     dev: false
     resolution:
@@ -5954,6 +5998,65 @@ packages:
       node: '>=0.10.0'
     resolution:
       integrity: sha1-AerA/jta9xoqbAL+q7jB/vfgDqs=
+  /postcss-modules-extract-imports/2.0.0:
+    dependencies:
+      postcss: 7.0.26
+    dev: false
+    engines:
+      node: '>= 6'
+    resolution:
+      integrity: sha512-LaYLDNS4SG8Q5WAWqIJgdHPJrDDr/Lv775rMBFUbgjTz6j34lUznACHcdRWroPvXANP2Vj7yNK57vp9eFqzLWQ==
+  /postcss-modules-local-by-default/3.0.2:
+    dependencies:
+      icss-utils: 4.1.1
+      postcss: 7.0.26
+      postcss-selector-parser: 6.0.2
+      postcss-value-parser: 4.0.2
+    dev: false
+    engines:
+      node: '>= 6'
+    resolution:
+      integrity: sha512-jM/V8eqM4oJ/22j0gx4jrp63GSvDH6v86OqyTHHUvk4/k1vceipZsaymiZ5PvocqZOl5SFHiFJqjs3la0wnfIQ==
+  /postcss-modules-scope/2.1.1:
+    dependencies:
+      postcss: 7.0.26
+      postcss-selector-parser: 6.0.2
+    dev: false
+    engines:
+      node: '>= 6'
+    resolution:
+      integrity: sha512-OXRUPecnHCg8b9xWvldG/jUpRIGPNRka0r4D4j0ESUU2/5IOnpsjfPPmDprM3Ih8CgZ8FXjWqaniK5v4rWt3oQ==
+  /postcss-modules-values/3.0.0:
+    dependencies:
+      icss-utils: 4.1.1
+      postcss: 7.0.26
+    dev: false
+    resolution:
+      integrity: sha512-1//E5jCBrZ9DmRX+zCtmQtRSV6PV42Ix7Bzj9GbwJceduuf7IqP8MgeTXuRDHOWj2m0VzZD5+roFWDuU8RQjcg==
+  /postcss-selector-parser/6.0.2:
+    dependencies:
+      cssesc: 3.0.0
+      indexes-of: 1.0.1
+      uniq: 1.0.1
+    dev: false
+    engines:
+      node: '>=4'
+    resolution:
+      integrity: sha512-36P2QR59jDTOAiIkqEprfJDsoNrvwFei3eCqKd1Y0tUsBimsq39BLp7RD+JWny3WgB1zGhJX8XVePwm9k4wdBg==
+  /postcss-value-parser/4.0.2:
+    dev: false
+    resolution:
+      integrity: sha512-LmeoohTpp/K4UiyQCwuGWlONxXamGzCMtFxLq4W1nZVGIQLYvMCJx3yAF9qyyuFpflABI9yVdtJAqbihOsCsJQ==
+  /postcss/7.0.26:
+    dependencies:
+      chalk: 2.4.2
+      source-map: 0.6.1
+      supports-color: 6.1.0
+    dev: false
+    engines:
+      node: '>=6.0.0'
+    resolution:
+      integrity: sha512-IY4oRjpXWYshuTDFxMVkJDtWIk2LhsTlu8bZnbEJA4+bYT16Lvpo8Qv6EvDumhYRgzjZl489pmsY3qVgJQ08nA==
   /prebuild-install/5.3.3:
     dependencies:
       detect-libc: 1.0.3
@@ -7376,7 +7479,7 @@ packages:
       webpack: ^4.0.0
     resolution:
       integrity: sha512-QMxecFz/gHQwteWwSo5nTc6UaICqN1bMedC5sMtUc7y3Ha3Q8y6ZO0iCR8pq4RJC8Hjf0FEPEHZqcMB/+DFCrA==
-  /terser-webpack-plugin/2.3.4_webpack@4.41.6:
+  /terser-webpack-plugin/2.3.5_webpack@4.41.6:
     dependencies:
       cacache: 13.0.1
       find-cache-dir: 3.2.0
@@ -7394,7 +7497,7 @@ packages:
     peerDependencies:
       webpack: ^4.0.0 || ^5.0.0
     resolution:
-      integrity: sha512-Nv96Nws2R2nrFOpbzF6IxRDpIkkIfmhvOws+IqMvYdFLO7o6wAILWFKONFgaYy8+T4LVz77DQW0f7wOeDEAjrg==
+      integrity: sha512-WlWksUoq+E4+JlJ+h+U+QUzXpcsMSSNXkDy9lBVkSqDn1w23Gg29L/ary9GeJVYCGiNJJX7LnVc4bwL1N3/g1w==
   /terser/4.6.3:
     dependencies:
       commander: 2.20.3
@@ -7619,6 +7722,10 @@ packages:
       node: '>=0.10.0'
     resolution:
       integrity: sha512-tJfXmxMeWYnczCVs7XAEvIV7ieppALdyepWMkHkwciRpZraG/xwT+s2JN8+pr1+8jCRf80FFzvr+MpQeeoF4Xg==
+  /uniq/1.0.1:
+    dev: false
+    resolution:
+      integrity: sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8=
   /unique-filename/1.1.1:
     dependencies:
       unique-slug: 2.0.2
@@ -8386,6 +8493,7 @@ packages:
       integrity: sha1-lSj0QtqxsihOWLQ3m7GU4i4MQAU=
 specifiers:
   copy-webpack-plugin: ^5.1.1
+  css-loader: ^3.4.2
   elm-hot-webpack-loader: ^1.1.6
   elm-webpack-loader: ^6.0.1
   favicons-webpack-plugin: ^1.0.2
@@ -8396,7 +8504,7 @@ specifiers:
   prerender-spa-plugin: ^3.4.0
   style-loader: ^1.1.3
   tempy: ^0.3.0
-  terser-webpack-plugin: ^2.3.4
+  terser-webpack-plugin: ^2.3.5
   webpack: ^4.41.6
   webpack-cli: ^3.3.11
   webpack-dev-server: ^3.10.3

webpack.config.js

@@ -172,7 +172,7 @@ module.exports = (env, argv) => ({
       },
       {
         test: /\.css$/i,
-        use: ['style-loader'],
+        use: ['style-loader', 'css-loader'],
       },
     ],
   },