github/JavaScriptServices
1
1
Fork 0
mirror of https://github.com/aspnet/JavaScriptServices.git synced 2025-12-25 11:07:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add option to configure Webpack Hot Middleware client

Browse Source 
Addresses #667
This commit is contained in:
Thomas Hermann
2017-02-25 12:07:01 -05:00
committed by Steve Sanderson
parent 347524a116
commit ce40973859
3 changed files with 27 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/Microsoft.AspNetCore.SpaServices/npm/aspnet-webpack/src/WebpackDevMiddleware.ts
View File

@@ -3,6 +3,7 @@ import * as webpack from 'webpack';
import * as url from 'url';
import * as fs from 'fs';
import * as path from 'path';
import * as querystring from 'querystring';
import { requireNewCopy } from './RequireNewCopy';
export type CreateDevServerResult = {
@@ -26,6 +27,7 @@ interface CreateDevServerOptions {
interface DevServerOptions {
HotModuleReplacement: boolean;
HotModuleReplacementServerPort: number;
HotModuleReplacementClientOptions: Object;
ReactHotModuleReplacement: boolean;
}
@@ -37,7 +39,7 @@ interface WebpackConfigFunc {
}
type WebpackConfigFileExport = WebpackConfigOrArray | WebpackConfigFunc;
function attachWebpackDevMiddleware(app: any, webpackConfig: webpack.Configuration, enableHotModuleReplacement: boolean, enableReactHotModuleReplacement: boolean, hmrClientEndpoint: string, hmrServerEndpoint: string) {
function attachWebpackDevMiddleware(app: any, webpackConfig: webpack.Configuration, enableHotModuleReplacement: boolean, enableReactHotModuleReplacement: boolean, hmrClientOptions: HotModuleReplacementClientOptions, hmrClientEndpoint: string, hmrServerEndpoint: string) {
// Build the final Webpack config based on supplied options
if (enableHotModuleReplacement) {
// For this, we only support the key/value config format, not string or string[], since
@@ -53,7 +55,8 @@ function attachWebpackDevMiddleware(app: any, webpackConfig: webpack.Configurati
// Augment all entry points so they support HMR (unless they already do)
Object.getOwnPropertyNames(entryPoints).forEach(entryPointName => {
const webpackHotMiddlewareEntryPoint = 'webpack-hot-middleware/client';
const webpackHotMiddlewareOptions = `?path=` + encodeURIComponent(hmrClientEndpoint);
hmrClientOptions.path = hmrClientEndpoint;
const webpackHotMiddlewareOptions = '?' + querystring.stringify(hmrClientOptions);
if (typeof entryPoints[entryPointName] === 'string') {
entryPoints[entryPointName] = [webpackHotMiddlewareEntryPoint + webpackHotMiddlewareOptions, entryPoints[entryPointName]];
} else if (firstIndexOfStringStartingWith(entryPoints[entryPointName], webpackHotMiddlewareEntryPoint) < 0) {
@@ -225,6 +228,7 @@ export function createWebpackDevServer(callback: CreateDevServerCallback, option
const enableHotModuleReplacement = options.suppliedOptions.HotModuleReplacement;
const enableReactHotModuleReplacement = options.suppliedOptions.ReactHotModuleReplacement;
const hmrClientOptions = options.suppliedOptions.HotModuleReplacementClientOptions || {};
if (enableReactHotModuleReplacement && !enableHotModuleReplacement) {
callback('To use ReactHotModuleReplacement, you must also enable the HotModuleReplacement option.', null);
return;
@@ -263,7 +267,7 @@ export function createWebpackDevServer(callback: CreateDevServerCallback, option
|| `http://localhost:${listener.address().port}/__webpack_hmr`; // Fall back on absolute URL to bypass proxying
const hmrServerEndpoint = options.hotModuleReplacementEndpointUrl
|| '/__webpack_hmr'; // URL is relative to webpack dev server root
attachWebpackDevMiddleware(app, webpackConfig, enableHotModuleReplacement, enableReactHotModuleReplacement, hmrClientEndpoint, hmrServerEndpoint);
attachWebpackDevMiddleware(app, webpackConfig, enableHotModuleReplacement, enableReactHotModuleReplacement, hmrClientOptions, hmrClientEndpoint, hmrServerEndpoint);
}
});