Update webpack configurations to v4

package.json

@@ -37,8 +37,9 @@
     "prettier": "^1.13.0",
     "sinon": "^5.0.10",
     "string-replace-loader": "^2.1.1",
-    "webpack": "^3.10.0",
-    "webpack-dev-server": "^2.11.1",
+    "webpack": "^4.14.0",
+    "webpack-cli": "^3.0.8",
+    "webpack-dev-server": "^3.1.4",
     "whatwg-fetch": "^2.0.4"
   },
   "keywords": [

webpack.config.js

@@ -1,25 +1,27 @@
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const pkg = require('./package.json');
 const webpack = require('webpack');
+const path = require('path');
 const fs = require('fs');
 let plugins = [];
 
 module.exports = env => {
-
+  const name = pkg.name;
+  const isProd = env === 'prod';
   const output = {
-    filename: './dist/grapes.min.js',
-    library: 'grapesjs',
+    path: path.join(__dirname, 'dist'),
+    filename: 'grapes.min.js',
+    library: name,
     libraryTarget: 'umd',
   };
 
-  if (env == 'prod') {
+  if (isProd) {
     plugins = [
       new webpack.optimize.ModuleConcatenationPlugin(),
-      new webpack.optimize.UglifyJsPlugin({ minimize:true, compressor: {warnings:false}}),
-      new webpack.BannerPlugin(`${pkg.name} - ${pkg.version}`),
+      new webpack.BannerPlugin(`${name} - ${pkg.version}`),
     ];
-  } else if (env == 'dev') {
-    output.filename = './dist/grapes.js';
+  } else if (env === 'dev') {
+    output.filename = 'grapes.js';
   } else {
     const index = 'index.html';
     const indexDev = `_${index}`;
@@ -36,8 +38,9 @@ module.exports = env => {
     entry: './src',
     output: output,
     plugins: plugins,
+    mode: isProd ? 'production' : 'development',
     module: {
-      loaders: [{
+      rules: [{
         test: /\/index\.js$/,
         loader: 'string-replace-loader',
         query: {