Update webpack

frontend/js/app.js

@@ -5,17 +5,12 @@ import "file-loader?name=[name].[ext]!../index.html"
 import "file-loader?name=img/[name].png!../img/noimage.png"
 
 // Import favicon settings
-import "file-loader?name=[name].png!../img/android-chrome-192x192.png"
-import "file-loader?name=[name].png!../img/android-chrome-512x512.png"
 import "file-loader?name=[name].png!../img/apple-touch-icon.png"
 import "file-loader?name=[name].png!../img/favicon-16x16.png"
 import "file-loader?name=[name].png!../img/favicon-32x32.png"
 import "file-loader?name=[name].png!../img/favicon.ico"
 import "file-loader?name=[name].png!../img/safari-pinned-tab.svg"
 
-// Import manifest
-import "file-loader?name=[name].json!../manifest.json"
-
 // Styles
 import "../less/app.less"
 

frontend/manifest.json

@@ -1,22 +0,0 @@
-{
-  "name": "Canapé",
-  "short_name": "Canapé",
-  "theme_color": "#4e5d6c",
-  "background_color": "#4e5d6c",
-  "icons": [
-      {
-          "src": "/android-chrome-192x192.png",
-          "sizes": "192x192",
-          "type": "image/png"
-      },
-      {
-          "src": "/android-chrome-512x512.png",
-          "sizes": "512x512",
-          "type": "image/png"
-      }
-  ],
-  "display": "standalone",
-  "orientation": "portrait",
-  "scope": "/",
-  "start_url": "/"
-}

package.json

@@ -1,14 +1,10 @@
 {
     "name": "canape",
     "scripts": {
-        "start": "NODE_ENV=development ./node_modules/webpack/bin/webpack.js -d --progress --colors --watch",
-        "build": "NODE_ENV=production ./node_modules/webpack/bin/webpack.js -p --progress --colors"
+        "start": "./node_modules/webpack/bin/webpack.js -d --progress --colors --watch",
+        "build": "./node_modules/webpack/bin/webpack.js --mode=production -p --progress --colors",
     },
     "dependencies": {
-        "babel-cli": "^6.26.0",
-        "babel-polyfill": "^6.26.0",
-        "babel-preset-env": "^1.6.1",
-        "babel-preset-stage-2": "^6.24.1",
         "bootstrap": "^3.3.6",
         "bootswatch": "^3.3.7",
         "font-awesome": "^4.7.0",
@@ -33,24 +29,26 @@
         "redux-logger": "^3.0.6",
         "redux-thunk": "^2.2.0",
         "ua-parser-js": "^0.7.17",
-        "universal-cookie": "^2.1.2",
-        "webpack": "^3.11.0"
+        "universal-cookie": "^2.1.2"
     },
     "devDependencies": {
+        "@babel/core": "^7.0.0-0",
+        "@babel/preset-env": "^7.4.4",
+        "@babel/preset-react": "^7.0.0",
         "axios": "^0.17.1",
-        "babel-core": "^6.26.0",
-        "babel-eslint": "^8.2.1",
-        "babel-loader": "^7.1.2",
-        "babel-preset-react": "^6.24.1",
+        "babel-loader": "^8.0.6",
         "css-loader": "^0.26.0",
         "del": "^3.0.0",
         "eslint": "^4.17.0",
         "eslint-plugin-react": "^7.6.1",
-        "file-loader": "^0.9.0",
+        "file-loader": "^3.0.1",
         "less": "^2.3.1",
         "less-loader": "^4.0.5",
-        "style-loader": "^0.20.1",
-        "url-loader": "^0.6.2",
+        "style-loader": "^0.23.1",
+        "url-loader": "^1.1.2",
+        "webpack": "^4.31.0",
+        "webpack-cli": "^3.3.2",
+        "webpack-pwa-manifest": "^4.0.0",
         "webpack-stream": "^4.0.1"
     }
 }

webpack.config.js

@@ -1,5 +1,6 @@
 var webpack = require("webpack");
 var path = require("path");
+var WebpackPwaManifest = require("webpack-pwa-manifest")
 
 var BUILD_DIR = path.resolve(__dirname, "build/public/");
 if (process.env.NODE_ENV === "production") {
@@ -22,7 +23,7 @@ const config = {
         use: {
           loader: "babel-loader",
           options: {
-            presets: ["env", "react", "stage-2"]
+            presets: ["@babel/preset-env", "@babel/preset-react"]
           }
         }
       },
@@ -53,6 +54,28 @@ const config = {
   plugins: [
     new webpack.DefinePlugin({
       "process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV)
+    }),
+    new WebpackPwaManifest({
+      fingerprints: false,
+      inject: false,
+      name: "Canapé",
+      short_name: "Canapé",
+      background_color: "#4e5d6c",
+      theme_color: "#4e5d6c",
+      display: "standalone",
+      orientation: "portrait",
+      scope: "/",
+      start_url: "/",
+      icons: [
+        {
+          src: path.resolve(__dirname, "frontend/img/android-chrome-192x192.png"),
+          size: "192x192"
+        },
+        {
+          src: path.resolve(__dirname, "frontend/img/android-chrome-512x512.png"),
+          size: "512x512"
+        }
+      ]
     })
   ],
   resolve: {
@@ -60,11 +83,7 @@ const config = {
   },
 };
 
-if (process.env.NODE_ENV === "production") {
-  config.plugins.push(
-    new webpack.optimize.UglifyJsPlugin()
-  )
-} else {
+if (process.env.NODE_ENV !== "production") {
   config.devtool = "#cheap-module-source-map"
 }