Images are now production worthy

package.json

@@ -37,6 +37,7 @@
     "express": "^4.16.3",
     "file-loader": "^1.1.11",
     "html-webpack-plugin": "^3.2.0",
+    "jimp": "^0.2.28",
     "mini-css-extract-plugin": "^0.4.1",
     "node-sass": "^4.9.0",
     "nodemailer": "^4.6.7",
@@ -50,6 +51,7 @@
     "react-tap-event-plugin": "^3.0.3",
     "react-transition-group": "^2.3.1",
     "redux": "^4.0.0",
+    "responsive-loader": "^1.1.0",
     "sanitize-html": "^1.18.2",
     "sass-loader": "^7.0.3",
     "style-loader": "^0.21.0",
@@ -58,11 +60,8 @@
     "webpack": "^4.14.0"
   },
   "devDependencies": {
-    "jimp": "^0.2.28",
     "nodemon": "^1.17.5",
     "react-hot-loader": "^4.3.3",
-    "responsive-loader": "^1.1.0",
-    "sharp": "^0.20.5",
     "webpack-cli": "^3.0.8",
     "webpack-dev-server": "^3.1.4"
   }

private/server/WebpackCompilerOptions.js

@@ -78,7 +78,7 @@ module.exports = function(server, app) {
       },
 
       {
-        test: /\.jpe?g$|\.gif$|\.png$|\.svg|\.webm|\.mp4$/i,
+        test: /\.svg|\.webm|\.mp4$/i,
         use: [{
           loader: "file-loader",
           options: {
@@ -88,6 +88,18 @@ module.exports = function(server, app) {
         }]
       },
 
+      {
+        test: /\.jpe?g$|\.gif$|\.png$/i,
+        use: [{
+          loader: "responsive-loader",
+          options: {
+            sizes: [128, 256, 500, 750, 1000, 1250, 1500, 2000, 2250, 2500],
+            name: "[path][name]_[width]x.[ext]",
+            context: 'public'
+          }
+        }]
+      },
+
       {
         test: /\.(eot|ttf|woff(2)?)(\?v=\d+\.\d+\.\d+)?/,
         loader: 'url-loader'