migrate to webpack 4

Author: tiagoschenkel

package.json

@@ -10,8 +10,10 @@
     "autoformat": "prettier --config .prettierrc --write {src,test}/**/{*,*.test}.ts",
     "tslint-check": "tslint-config-prettier-check ./tslint.json",
     "clean-up": "rimraf .nyc_output && rimraf coverage && rimraf lib",
+    "compile": "tsc -d",
+    "dev": "webpack",
     "build": "webpack --env.production",
-    "prepare": "npm run clean-up && tsc -d",
+    "prepare": "npm run clean-up && npm run compile",
     "prepublishOnly": "publish-please guard",
     "publish-please": "npm run autoformat && npm run clean-up && npm run build && npm run test && publish-please"
   },
@@ -99,7 +101,9 @@
     "tslint": "^5.9.1",
     "tslint-config-prettier": "^1.9.0",
     "typescript": "^2.6.2",
+    "uglifyjs-webpack-plugin": "^1.2.2",
     "webpack": "^4.1.0",
+    "webpack-cli": "^2.0.10",
     "webpack-dev-server": "^3.1.0"
   }
 }

tsconfig.json

@@ -7,7 +7,7 @@
     "moduleResolution": "node",
     "declaration": true,
     "noImplicitAny": false,
-    "sourceMap": true
+    "sourceMap": false
   },
   "include": [
     "./src/**/*.ts"

webpack.config.js

@@ -1,32 +1,38 @@
 const webpack = require('webpack');
 const path = require('path');
+const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
 
-module.exports = (function(options) {
+module.exports = (env => {
 
-  if (!options) options = {isTest: false};
+  if (!env) env = {production: false};
 
-  var tsconfig = options.isTest ? "tsconfig.test.json" : "tsconfig.json";
+  let tsconfig = env.production ? "tsconfig.json" : "tsconfig.test.json";
+  let filename = env.production ? "signals.min.js" : "signals.js";
 
   return {
+    mode: env.production ? "production" : "development",
     entry: {
       main: path.join(__dirname, "src/index.ts")
     },
 
     output: {
       path: path.join(__dirname, "dist"),
-      filename: "signals.min.js",
+      filename: filename,
 
       libraryTarget: "var",
       library: "SignalsJS"
     },
 
-    devtool: 'inline-source-map',
+    devtool: env.production ? undefined : "inline-source-map",
 
     module: {
       rules: [
-        { test: /\.ts$/, loader: "ts-loader?configFile=" + tsconfig },
         {
-          test: ((options.production) /* disable this loader for production builds */
+          test: /\.ts$/,
+          loader: "ts-loader?configFile=" + tsconfig
+        },
+        {
+          test: ((env.production) /* disable this loader for production builds */
             ? /^$/
             : /^(.(?!\.test))*\.ts$/),
           loader: "istanbul-instrumenter-loader",
@@ -39,8 +45,8 @@ module.exports = (function(options) {
     },
 
     plugins: (
-      (options.production)
-        ? [ new webpack.optimize.UglifyJsPlugin({ sourceMap: false }) ]
+      (env.production)
+        ? [ new UglifyJSPlugin() ]
         : [ new webpack.SourceMapDevToolPlugin({ test: /\.ts$/i }) ]
     ),