diff --git a/index.html b/index.html
index 0d11d4c..e849f5d 100644
--- a/index.html
+++ b/index.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8">
     <title>Using OpenLayers with Webpack</title>
+    <link rel="stylesheet" href="https://openlayers.org/en/latest/css/ol.css" type="text/css">
     <style>
       html, body {
         margin: 0;
diff --git a/main.js b/main.js
index 7f362aa..80d18cd 100644
--- a/main.js
+++ b/main.js
@@ -1,8 +1,6 @@
-import 'ol/ol.css';
-import Map from 'ol/map';
-import View from 'ol/view';
-import TileLayer from 'ol/layer/tile';
-import XYZ from 'ol/source/xyz';
+import {Map, View} from 'ol';
+import TileLayer from 'ol/layer/Tile';
+import XYZ from 'ol/source/XYZ';
 
 new Map({
   target: 'map',
diff --git a/package.json b/package.json
index e7f5f7e..f1b07e7 100644
--- a/package.json
+++ b/package.json
@@ -3,14 +3,13 @@
   "version": "1.0.0",
   "description": "Example using OpenLayers with Webpack",
   "scripts": {
-    "build": "webpack --config webpack.config.js"
+    "build": "webpack --config webpack.config.js --mode production"
   },
   "devDependencies": {
-    "css-loader": "^0.28.4",
-    "style-loader": "^0.18.2",
-    "webpack": "^3.3.0"
+    "webpack": "^4.12.1",
+    "webpack-command": "^0.3.0"
   },
   "dependencies": {
-    "ol": "^4.2.0"
+    "ol": "^5.0.0"
   }
 }
diff --git a/webpack.config.js b/webpack.config.js
index 65d5a9f..df397e6 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -3,20 +3,7 @@ const webpack = require('webpack');
 module.exports = {
   entry: './main.js',
   output: {
+    path: __dirname,
     filename: 'bundle.js'
   },
-  module: {
-    rules: [
-      {
-        test: /\.css$/,
-        use: [
-          {loader: 'style-loader'},
-          {loader: 'css-loader'}
-        ]
-      }
-    ]
-  },
-  plugins: [
-    new webpack.optimize.UglifyJsPlugin()
-  ]
 };
