Merge branch 'release/1.8.0'

Author: 8eecf0d2

package.json

@@ -1,6 +1,6 @@
 {
   "name": "netlify-local",
-  "version": "1.7.1",
+  "version": "1.8.0",
   "description": "Local Netlify service emulation",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -29,11 +29,13 @@
     "@types/node": "^10.11.7",
     "@types/serve-static": "^1.13.2",
     "@types/webpack": "^4.4.16",
+    "@types/webpack-hot-middleware": "^2.16.4",
     "assert": "^1.4.1",
     "mocha": "^5.2.0",
     "ts-mocha": "^2.0.0",
     "tslint": "^5.12.0",
-    "typescript": "^3.1.3"
+    "typescript": "^3.1.3",
+    "webpack-hot-middleware": "^2.24.3"
   },
   "dependencies": {
     "body-parser": "^1.18.3",
@@ -50,6 +52,6 @@
     "webpack": "^4.20.2"
   },
   "files": [
-    ".dist"
+    "dist"
   ]
 }

src/ts/cli.ts

@@ -2,6 +2,7 @@
 
 import * as fs from "fs";
 import * as path from "path";
+import * as webpack from "webpack";
 import * as program from "commander";
 
 import { Logger } from "./helper";
@@ -34,6 +35,7 @@ program
       const netlifyConfig = parseNetlifyConfig(program.netlify || "netlify.toml", {
         webpack: {
           config: program.webpack,
+          hmr: program.hmr,
         },
         server: {
           static: program.static === undefined ? undefined : program.static === "false" ? false : true,
@@ -43,19 +45,23 @@ program
         },
       });
 
+      let compilers: Array<webpack.Compiler>;
+
+      if (netlifyConfig.plugins.local.webpack.config) {
+        const webpackConfig = parseWebpackConfig(netlifyConfig.plugins.local.webpack.config);
+        const webpackClient = new Webpack(webpackConfig);
+        compilers = webpackClient.compilers;
+        webpackClient.watch();
+      }
+
       const server = new Server({
         netlifyConfig: netlifyConfig,
         findAvailablePort: !program.hasOwnProperty("port"),
+        compilers: compilers,
       });
 
       await server.listen();
 
-      if (netlifyConfig.plugins.local.webpack.config) {
-        const webpackConfig = parseWebpackConfig(netlifyConfig.plugins.local.webpack.config);
-        const webpack = new Webpack(webpackConfig);
-        webpack.watch();
-      }
-
     })()
       .catch((error) => {
         Logger.error(error);
@@ -75,6 +81,7 @@ program
       const netlifyConfig = parseNetlifyConfig(program.netlify || "netlify.toml", {
         webpack: {
           config: program.webpack,
+          hmr: program.hmr,
         },
       });
 
@@ -103,6 +110,7 @@ program
       const netlifyConfig = parseNetlifyConfig(program.netlify || "netlify.toml", {
         webpack: {
           config: program.webpack,
+          hmr: program.hmr,
         },
       });
 

src/ts/netlify.ts

@@ -20,6 +20,7 @@ export namespace Netlify {
     export interface Local {
       webpack?: {
         config: string;
+        hmr: boolean;
       };
       server?: {
         static?: boolean;

src/ts/utility/config.ts

@@ -29,7 +29,7 @@ export const composeWebpackEntry = (netlifyConfig: Netlify.Config) => {
   }, {});
 };
 
-export const composeWebpackOutput = (netlifyConfig: Netlify.Config): { path: string, filename: string, libraryTarget: webpack.LibraryTarget} => {
+export const composeWebpackOutput = (netlifyConfig: Netlify.Config): webpack.Output => {
   return {
     path: path.join(process.cwd(), netlifyConfig.build.functions),
     filename: "[name].js",
@@ -93,6 +93,7 @@ export const parseNetlifyPluginLocalConfig = (netlifyConfig: Netlify.Config, ove
   const netlifyPluginLocalConfig: Netlify.Plugins.Local = {
     webpack: {
       config: undefined,
+      hmr: false,
     },
     server: {
       static: true,
@@ -113,6 +114,9 @@ export const parseNetlifyPluginLocalConfig = (netlifyConfig: Netlify.Config, ove
         if (netlifyConfig.plugins.local.webpack.config !== undefined) {
           netlifyPluginLocalConfig.webpack.config = netlifyConfig.plugins.local.webpack.config;
         }
+        if (netlifyConfig.plugins.local.webpack.hmr !== undefined) {
+          netlifyPluginLocalConfig.webpack.hmr = netlifyConfig.plugins.local.webpack.hmr;
+        }
       }
       if (netlifyConfig.plugins.local.server !== undefined) {
         if (netlifyConfig.plugins.local.server.static !== undefined) {

src/ts/utility/server.ts

@@ -1,5 +1,6 @@
 import * as path from "path";
 import * as express from "express";
+import * as webpack from "webpack";
 import * as bodyParser from "body-parser";
 import * as serveStatic from "serve-static";
 import * as queryString from "querystring";
@@ -8,9 +9,11 @@ import * as http from "http";
 import * as https from "https";
 import { URL } from "url";
 import * as UrlPattern from "url-pattern";
+// @ts-ignore
 import * as getPort from "get-port";
 // @ts-ignore
 import * as expressHttpProxy from "express-http-proxy";
+import * as webpackHotMiddleware from "webpack-hot-middleware";
 
 import { Logger } from "../helper";
 import { Netlify } from "../netlify";
@@ -185,6 +188,10 @@ export class Server {
     this.express.use(bodyParser.raw({ limit: "6mb" }));
     this.express.use(bodyParser.text({ limit: "6mb", type: "*/*" }));
 
+    if(this.options.netlifyConfig.plugins.local.webpack.hmr) {
+      this.webpackHotMiddleware(this.options.compilers);
+    }
+
     const hardRedirects = this.options.netlifyConfig.redirects.filter((redirect) => redirect.force === true);
     const softRedirects = this.options.netlifyConfig.redirects.filter((redirect) => redirect.force === false);
 
@@ -195,6 +202,14 @@ export class Server {
     this.routeRedirects(softRedirects);
   }
 
+  public webpackHotMiddleware(compilers: Array<webpack.Compiler>): void {
+    const clientCompiler = compilers.find(compiler => compiler.name === "client");
+    const clientMiddleware = webpackHotMiddleware(clientCompiler, {
+      log: false,
+    });
+    this.express.use(clientMiddleware);
+  }
+
   /**
    * Static Router
    */
@@ -343,6 +358,7 @@ export namespace Server {
   export interface Options {
     netlifyConfig: Netlify.Config;
     findAvailablePort?: boolean;
+    compilers?: Array<webpack.Compiler>;
   }
   export interface Certificates {
     key: string;

src/ts/utility/webpack.ts

@@ -10,7 +10,7 @@ export class Webpack {
     this.initialize();
   }
   private configs: Array<Webpack.Config>;
-  private compilers: Array<webpack.Compiler>;
+  public compilers: Array<webpack.Compiler>;
 
   public initialize(): void {
     this.compilers = this.configs.map((config) => webpack(config));