[Misc] Fix webpacker compilation of files only required with require.context

I don't believe this is intentional behaviour but it's also not getting any udpates anymore
This at least makes it work

app/javascript/packs/application.js

@@ -32,7 +32,7 @@ require('../src/styles/base.scss');
 
 importAll(require.context('../src/javascripts', true, /\.js(\.erb)?$/));
 
-require.context("../../../public/images/favicons", true)
+require.context("../../../public/images", true)
 
 export { default as Artist } from '../src/javascripts/artist.js';
 export { default as Autocomplete } from '../src/javascripts/autocomplete.js.erb';

app/javascript/src/styles/common/blacklists.scss

@@ -76,7 +76,7 @@
     height: 0px !important;
     width: 0px !important;
     padding: 150px 150px 0px 0px !important;
-    background: url("images/blacklisted-preview.png") !important;
+    background: url("blacklisted-preview.png") !important;
 
     @media screen and (max-width: 800px) {
       background-size: 100px !important;

app/javascript/src/styles/common/page_header.scss

@@ -12,7 +12,7 @@
     grid-area: logo;
 
     margin-top: 6px;
-    background-image: url("images/main-logo.png");
+    background-image: url("main-logo.png");
     background-repeat: no-repeat;
     background-size: contain;
     background-position-y: center;

app/javascript/src/styles/common/z_responsive.scss

@@ -292,7 +292,7 @@
             display: inline-block;
             padding: 6px 10px;
 
-            background-image: url("images/main-logo.png");
+            background-image: url("main-logo.png");
             background-repeat: no-repeat;
             background-size: contain;
 

app/javascript/src/styles/themes/_extra_aurora.scss

@@ -1,5 +1,5 @@
 body[data-th-extra="aurora"] {
-  --image-foreground: url("images/themes/extras/aurora.png");
+  --image-foreground: url("themes/extras/aurora.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
 }

app/javascript/src/styles/themes/_extra_autumn.scss

@@ -1,5 +1,5 @@
 body[data-th-extra="autumn"] {
-  --image-foreground: url("images/themes/extras/leaves_bottom.png");
+  --image-foreground: url("themes/extras/leaves_bottom.png");
   --image-foreground-position: left bottom;
   --image-foreground-repeat: repeat-x;
   --content-padding-bottom: 6rem;

app/javascript/src/styles/themes/_extra_hexagons.scss

@@ -1,5 +1,5 @@
 body {
-  --image-foreground: url("images/themes/extras/hex.png");
+  --image-foreground: url("themes/extras/hex.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
   --content-padding-bottom: 0.5rem;

app/javascript/src/styles/themes/_extra_space.scss

@@ -1,5 +1,5 @@
 body[data-th-extra="space"] {
-  --image-foreground: url("images/themes/extras/space.png");
+  --image-foreground: url("themes/extras/space.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
 }

app/javascript/src/styles/themes/_extra_spring.scss

@@ -1,8 +1,8 @@
 body[data-th-extra="spring"] {
-  --image-foreground: url("images/themes/extras/spring_bottom.png"),
+  --image-foreground: url("themes/extras/spring_bottom.png"),
-                      url("images/themes/extras/spring_bottom_fox.png"),
+                      url("themes/extras/spring_bottom_fox.png"),
-                      url("images/themes/extras/spring_top.png"),
+                      url("themes/extras/spring_top.png"),
-                      url("images/themes/extras/spring_top_sky.png");
+                      url("themes/extras/spring_top_sky.png");
   --image-foreground-position: left bottom, right bottom ,right top ,left top;
   --image-foreground-repeat: repeat-x, no-repeat, no-repeat, repeat-x;
   --content-padding-bottom: 3rem;

app/javascript/src/styles/themes/_extra_stars.scss

@@ -1,5 +1,5 @@
 body[data-th-extra="stars"] {
-  --image-foreground: url("images/themes/extras/stars.png");
+  --image-foreground: url("themes/extras/stars.png");
   --image-foreground-position: left top;
   --image-foreground-repeat: repeat-x;
 }

app/javascript/src/styles/themes/_extra_winter.scss

@@ -1,6 +1,6 @@
 body[data-th-extra="winter"] {
-  --image-foreground: url("images/themes/extras/snow_bottom.png"),
+  --image-foreground: url("themes/extras/snow_bottom.png"),
-                      url("images/themes/extras/snow_top.png");
+                      url("themes/extras/snow_top.png");
   --image-foreground-position: left bottom, left top;
   --image-foreground-repeat: repeat-x;
   --content-padding-bottom: 3rem;

app/javascript/src/styles/themes/_theme_hexagon.scss

@@ -9,7 +9,7 @@ $hexagon-color-section-border:    $hexagon-color-background;
 
 body {
   // Theme-specific images
-  --image-background:             url("images/themes/hexagon/background.png");
+  --image-background:             url("themes/hexagon/background.png");
 
   // Layout Colors
   --color-background:             #{$hexagon-color-background}; // Main background (dark blue, large hexagons)

config/webpacker.yml

@@ -11,7 +11,11 @@ default: &default
   # Additional paths webpack should look up modules
   # ['app/assets', 'engine/foo/app/assets']
   additional_paths:
-    - public
+    # Make the files available in css
+    - public/images
+    # Actually have webpacker add them to its digest so that assets:precompile works properly
+    # Modifying these files when only used with require.context did not pick up changes
+    - public/images/**/*
 
   # Reload manifest.json on all requests so we reload latest compiled packs
   cache_manifest: false