diff --git a/package.json b/package.json
index 48579bce8..2970d7d3d 100644
--- a/package.json
+++ b/package.json
@@ -109,8 +109,9 @@
     "sinon": "^4.4.2",
     "tap-spec": "^4.1.1",
     "trevor": "^2.2.0",
-    "webpack": "^3.3.0",
-    "webpack-bundle-analyzer": "^2.11.0"
+    "webpack": "^4.0.0",
+    "webpack-bundle-analyzer": "^2.11.0",
+    "webpack-cli": "^2.0.9"
   },
   "engines": {
     "node": ">=6"
diff --git a/webpack.config.js b/webpack.config.js
index ad2277ef6..fbf834ac5 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -33,6 +33,7 @@ if (PROD) {
 const baseFileName = `contentful`
 
 const baseBundleConfig = {
+  mode: PROD ? 'production' : 'development',
   context: path.join(__dirname, 'lib'),
   entry: [`./${baseFileName}.js`],
   output: {
@@ -41,7 +42,7 @@ const baseBundleConfig = {
     library: 'contentful'
   },
   module: {
-    loaders: []
+    rules: []
   },
   devtool: PROD ? false : 'source-map',
   plugins,
@@ -62,7 +63,7 @@ const defaultBabelLoader = {
 
 // Browsers
 const browserBundle = clone(baseBundleConfig)
-browserBundle.module.loaders = [
+browserBundle.module.rules = [
   Object.assign({}, defaultBabelLoader, {
     options: Object.assign({}, defaultBabelLoader.options, {
       forceEnv: 'browser'
@@ -73,7 +74,7 @@ browserBundle.output.filename = `${baseFileName}.browser${PROD ? '.min' : ''}.js
 
 // Legacy browsers like IE11
 const legacyBundle = clone(baseBundleConfig)
-legacyBundle.module.loaders = [
+legacyBundle.module.rules = [
   Object.assign({}, defaultBabelLoader, {
     options: Object.assign({}, defaultBabelLoader.options, {
       forceEnv: 'legacy'
@@ -95,7 +96,7 @@ legacyBundle.output.filename = `${baseFileName}.legacy${PROD ? '.min' : ''}.js`
 
 // Node
 const nodeBundle = clone(baseBundleConfig)
-nodeBundle.module.loaders = [
+nodeBundle.module.rules = [
   Object.assign({}, defaultBabelLoader, {
     options: Object.assign({}, defaultBabelLoader.options, {
       forceEnv: 'node'