webpack: add HMR

webpack/webpack-env-tests.ts

@@ -13,3 +13,30 @@ let contextModule = context<SomeModule>('./someModule');
 require(['./someModule', './otherModule'], (someModule: SomeModule, otherModule: any) => {
 
 });
+
+// check if HMR is enabled
+if(module.hot) {
+    // accept update of dependency
+    module.hot.accept("./handler.js", function() {
+        //...
+    });
+}
+
+module.exports = null;
+
+// check if HMR is enabled
+if(module.hot) {
+
+    // accept itself
+    module.hot.accept();
+
+    // dispose handler
+    module.hot.dispose(function() {
+        // revoke the side effect
+        //...
+    });
+}
+
+
+var status: string = module.hot.status();
+

webpack/webpack-env.d.ts

@@ -5,6 +5,7 @@
 
 /**
  * Webpack module API - variables and global functions available inside modules
+ * https://webpack.github.io/docs/api-in-modules.html
  */
 
 declare namespace __WebpackModuleApi {
@@ -101,3 +102,137 @@ declare var __non_webpack_require__: any;
  * Equals the config option debug
  */
 declare var DEBUG: boolean;
+
+/**
+ * Webpack Hot Module Replacement
+ * https://webpack.github.io/docs/hot-module-replacement.html
+ */
+declare namespace __WebpackHotModuleReplacement {
+  interface Module {
+    exports: any;
+    require(id: string): any;
+    id: string;
+    filename: string;
+    loaded: boolean;
+    parent: any;
+    children: any[];
+    hot: Hot;
+  }
+
+  interface Hot {
+    /**
+     * Accept code updates for the specified dependencies. The callback is called when dependencies were replaced.
+     * @param dependencies
+     * @param callback
+     */
+    accept(dependencies: string[], callback: (updatedDependencies: string[]) => void): void;
+    /**
+     * Accept code updates for the specified dependencies. The callback is called when dependencies were replaced.
+     * @param dependency
+     * @param callback
+     */
+    accept(dependency: string, callback: () => void): void;
+    /**
+     * Accept code updates for this module without notification of parents.
+     * This should only be used if the module doesn’t export anything.
+     * The errHandler can be used to handle errors that occur while loading the updated module.
+     * @param errHandler
+     */
+    accept(errHandler?: Function): void;
+    /**
+     * Do not accept updates for the specified dependencies. If any dependencies is updated, the code update fails with code "decline".
+     */
+    decline(dependencies: string[]): void;
+    /**
+     * Do not accept updates for the specified dependencies. If any dependencies is updated, the code update fails with code "decline".
+     */
+    decline(dependency: string): void;
+    /**
+     * Flag the current module as not update-able. If updated the update code would fail with code "decline".
+     */
+    decline(): void;
+    /**
+     * Add a one time handler, which is executed when the current module code is replaced.
+     * Here you should destroy/remove any persistent resource you have claimed/created.
+     * If you want to transfer state to the new module, add it to data object.
+     * The data will be available at module.hot.data on the new module.
+     * @param callback
+     */
+    dispose(callback: (data: any) => void): void;
+    /**
+     * Add a one time handler, which is executed when the current module code is replaced.
+     * Here you should destroy/remove any persistent resource you have claimed/created.
+     * If you want to transfer state to the new module, add it to data object.
+     * The data will be available at module.hot.data on the new module.
+     * @param callback
+     */
+    addDisposeHandler(callback: (data: any) => void): void;
+    /**
+     * Remove a handler.
+     * This can useful to add a temporary dispose handler. You could i. e. replace code while in the middle of a multi-step async function.
+     * @param callback
+     */
+    removeDisposeHandler(callback: (data: any) => void): void;
+    /**
+     * Throws an exceptions if status() is not idle.
+     * Check all currently loaded modules for updates and apply updates if found.
+     * If no update was found, the callback is called with null.
+     * If autoApply is truthy the callback will be called with all modules that were disposed.
+     * apply() is automatically called with autoApply as options parameter.
+     * If autoApply is not set the callback will be called with all modules that will be disposed on apply().
+     * @param autoApply
+     * @param callback
+     */
+    check(autoApply: boolean, callback: (err: Error, outdatedModules: any[]) => void): void;
+    /**
+     * Throws an exceptions if status() is not idle.
+     * Check all currently loaded modules for updates and apply updates if found.
+     * If no update was found, the callback is called with null.
+     * The callback will be called with all modules that will be disposed on apply().
+     * @param callback
+     */
+    check(callback: (err: Error, outdatedModules: any[]) => void): void;
+    /**
+     * If status() != "ready" it throws an error.
+     * Continue the update process.
+     * @param options
+     * @param callback
+     */
+    apply(options: AcceptOptions, callback: (err: Error, outdatedModules: any[]) => void): void;
+    /**
+     * If status() != "ready" it throws an error.
+     * Continue the update process.
+     * @param callback
+     */
+    apply(callback: (err: Error, outdatedModules: any[]) => void): void;
+    /**
+     * Return one of idle, check, watch, watch-delay, prepare, ready, dispose, apply, abort or fail.
+     */
+    status(): string;
+    /** Register a callback on status change. */
+    status(callback: (status: string) => void): void;
+    /** Register a callback on status change. */
+    addStatusHandler(callback: (status: string) => void): void;
+    /**
+     * Remove a registered status change handler.
+     * @param callback
+     */
+    removeStatusHandler(callback: (status: string) => void): void;
+
+    active: boolean;
+    data: any;
+  }
+
+  interface AcceptOptions {
+    /**
+     * If true the update process continues even if some modules are not accepted (and would bubble to the entry point).
+     */
+    ignoreUnaccepted: boolean;
+    /**
+     * Indicates that apply() is automatically called by check function
+     */
+    autoApply: boolean;
+  }
+}
+
+declare var module: __WebpackHotModuleReplacement.Module;