Added support for Thenables

Author: waterfoul

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

@@ -35,15 +35,25 @@ interface DevServerOptions {
  EnvParam: any;
 }
 
-// We support these three kinds of webpack.config.js export. We don't currently support exported promises
-// (though we might be able to add that in the future, if there's a need).
+// Interface as defined in es6-promise
+interface Thenable<T> {
+ then<U>(onFulfilled?: (value: T) => U | Thenable<U>, onRejected?: (error: any) => U | Thenable<U>): Thenable<U>;
+ then<U>(onFulfilled?: (value: T) => U | Thenable<U>, onRejected?: (error: any) => void): Thenable<U>;
+}
+
+// We support these four kinds of webpack.config.js export
 type WebpackConfigOrArray = webpack.Configuration | webpack.Configuration[];
+type WebpackConfigOrArrayOrThenable = WebpackConfigOrArray | Thenable<WebpackConfigOrArray>;
 interface WebpackConfigFunc {
- (env?: any): WebpackConfigOrArray;
+ (env?: any): WebpackConfigOrArrayOrThenable;
 }
-type WebpackConfigExport = WebpackConfigOrArray | WebpackConfigFunc;
+type WebpackConfigExport = WebpackConfigOrArrayOrThenable | WebpackConfigFunc;
 type WebpackConfigModuleExports = WebpackConfigExport | EsModuleExports<WebpackConfigExport>;
 
+function isThenable(obj: any) {
+ return obj && typeof (<Thenable<any>>obj).then === 'function';
+}
+
 function attachWebpackDevMiddleware(app: any, webpackConfig: webpack.Configuration, enableHotModuleReplacement: boolean, enableReactHotModuleReplacement: boolean, hmrClientOptions: StringMap<string>, hmrServerEndpoint: string) {
  // Build the final Webpack config based on supplied options
  if (enableHotModuleReplacement) {
@@ -251,76 +261,85 @@ export function createWebpackDevServer(callback: CreateDevServerCallback, option
  // your Startup.cs.
  webpackConfigExport = webpackConfigExport(options.suppliedOptions.EnvParam);
  }
- const webpackConfigArray = webpackConfigExport instanceof Array ? webpackConfigExport : [webpackConfigExport];
 
- const enableHotModuleReplacement = options.suppliedOptions.HotModuleReplacement;
- const enableReactHotModuleReplacement = options.suppliedOptions.ReactHotModuleReplacement;
- if (enableReactHotModuleReplacement && !enableHotModuleReplacement) {
- callback('To use ReactHotModuleReplacement, you must also enable the HotModuleReplacement option.', null);
- return;
- }
+ const webpackConfigThenable = isThenable(webpackConfigExport)
+ ? webpackConfigExport
+ : { then: callback => callback(webpackConfigExport) };
 
- // The default value, 0, means 'choose randomly'
- const suggestedHMRPortOrZero = options.suppliedOptions.HotModuleReplacementServerPort || 0;
+ webpackConfigThenable.then(webpackConfigResolved => {
+  const webpackConfigArray = webpackConfigResolved instanceof Array ? webpackConfigResolved : [webpackConfigResolved];
 
- const app = connect();
- const listener = app.listen(suggestedHMRPortOrZero, () => {
- try {
- // For each webpack config that specifies a public path, add webpack dev middleware for it
- const normalizedPublicPaths: string[] = [];
- webpackConfigArray.forEach(webpackConfig => {
- if (webpackConfig.target === 'node') {
- // For configs that target Node, it's meaningless to set up an HTTP listener, since
- // Node isn't going to load those modules over HTTP anyway. It just loads them directly
- // from disk. So the most relevant thing we can do with such configs is just write
- // updated builds to disk, just like "webpack --watch".
- beginWebpackWatcher(webpackConfig);
- } else {
- // For configs that target browsers, we can set up an HTTP listener, and dynamically
- // modify the config to enable HMR etc. This just requires that we have a publicPath.
- const publicPath = (webpackConfig.output.publicPath || '').trim();
- if (!publicPath) {
- throw new Error('To use the Webpack dev server, you must specify a value for \'publicPath\' on the \'output\' section of your webpack config (for any configuration that targets browsers)');
- }
- const publicPathNoTrailingSlash = removeTrailingSlash(publicPath);
- normalizedPublicPaths.push(publicPathNoTrailingSlash);
-
- // This is the URL the client will connect to, except that since it's a relative URL
- // (no leading slash), Webpack will resolve it against the runtime <base href> URL
- // plus it also adds the publicPath
- const hmrClientEndpoint = removeLeadingSlash(options.hotModuleReplacementEndpointUrl);
-
- // This is the URL inside the Webpack middleware Node server that we'll proxy to.
- // We have to prefix with the public path because Webpack will add the publicPath
- // when it resolves hmrClientEndpoint as a relative URL.
- const hmrServerEndpoint = ensureLeadingSlash(publicPathNoTrailingSlash + options.hotModuleReplacementEndpointUrl);
-
- // We always overwrite the 'path' option as it needs to match what the .NET side is expecting
- const hmrClientOptions = options.suppliedOptions.HotModuleReplacementClientOptions || <StringMap<string>>{};
- hmrClientOptions['path'] = hmrClientEndpoint;
-
- const dynamicPublicPathKey = 'dynamicPublicPath';
- if (!(dynamicPublicPathKey in hmrClientOptions)) {
- // dynamicPublicPath default to true, so we can work with nonempty pathbases (virtual directories)
- hmrClientOptions[dynamicPublicPathKey] = true;
- } else {
- // ... but you can set it to any other value explicitly if you want (e.g., false)
- hmrClientOptions[dynamicPublicPathKey] = JSON.parse(hmrClientOptions[dynamicPublicPathKey]);
- }
+ const enableHotModuleReplacement = options.suppliedOptions.HotModuleReplacement;
+ const enableReactHotModuleReplacement = options.suppliedOptions.ReactHotModuleReplacement;
+ if (enableReactHotModuleReplacement && !enableHotModuleReplacement) {
+ callback('To use ReactHotModuleReplacement, you must also enable the HotModuleReplacement option.', null);
+ return;
+ }
 
- attachWebpackDevMiddleware(app, webpackConfig, enableHotModuleReplacement, enableReactHotModuleReplacement, hmrClientOptions, hmrServerEndpoint);
- }
- });
+ // The default value, 0, means 'choose randomly'
+ const suggestedHMRPortOrZero = options.suppliedOptions.HotModuleReplacementServerPort || 0;
 
- // Tell the ASP.NET app what addresses we're listening on, so that it can proxy requests here
- callback(null, {
- Port: listener.address().port,
- PublicPaths: normalizedPublicPaths
- });
- } catch (ex) {
- callback(ex.stack, null);
- }
- });
+ const app = connect();
+ const listener = app.listen(suggestedHMRPortOrZero, () => {
+ try {
+ // For each webpack config that specifies a public path, add webpack dev middleware for it
+ const normalizedPublicPaths: string[] = [];
+ webpackConfigArray.forEach(webpackConfig => {
+ if (webpackConfig.target === 'node') {
+ // For configs that target Node, it's meaningless to set up an HTTP listener, since
+ // Node isn't going to load those modules over HTTP anyway. It just loads them directly
+ // from disk. So the most relevant thing we can do with such configs is just write
+ // updated builds to disk, just like "webpack --watch".
+ beginWebpackWatcher(webpackConfig);
+ } else {
+ // For configs that target browsers, we can set up an HTTP listener, and dynamically
+ // modify the config to enable HMR etc. This just requires that we have a publicPath.
+ const publicPath = (webpackConfig.output.publicPath || '').trim();
+ if (!publicPath) {
+ throw new Error('To use the Webpack dev server, you must specify a value for \'publicPath\' on the \'output\' section of your webpack config (for any configuration that targets browsers)');
+ }
+ const publicPathNoTrailingSlash = removeTrailingSlash(publicPath);
+ normalizedPublicPaths.push(publicPathNoTrailingSlash);
+
+ // This is the URL the client will connect to, except that since it's a relative URL
+ // (no leading slash), Webpack will resolve it against the runtime <base href> URL
+ // plus it also adds the publicPath
+ const hmrClientEndpoint = removeLeadingSlash(options.hotModuleReplacementEndpointUrl);
+
+ // This is the URL inside the Webpack middleware Node server that we'll proxy to.
+ // We have to prefix with the public path because Webpack will add the publicPath
+ // when it resolves hmrClientEndpoint as a relative URL.
+ const hmrServerEndpoint = ensureLeadingSlash(publicPathNoTrailingSlash + options.hotModuleReplacementEndpointUrl);
+
+ // We always overwrite the 'path' option as it needs to match what the .NET side is expecting
+ const hmrClientOptions = options.suppliedOptions.HotModuleReplacementClientOptions || <StringMap<string>>{};
+ hmrClientOptions['path'] = hmrClientEndpoint;
+
+ const dynamicPublicPathKey = 'dynamicPublicPath';
+ if (!(dynamicPublicPathKey in hmrClientOptions)) {
+ // dynamicPublicPath default to true, so we can work with nonempty pathbases (virtual directories)
+ hmrClientOptions[dynamicPublicPathKey] = true;
+ } else {
+ // ... but you can set it to any other value explicitly if you want (e.g., false)
+ hmrClientOptions[dynamicPublicPathKey] = JSON.parse(hmrClientOptions[dynamicPublicPathKey]);
+ }
+
+ attachWebpackDevMiddleware(app, webpackConfig, enableHotModuleReplacement, enableReactHotModuleReplacement, hmrClientOptions, hmrServerEndpoint);
+ }
+ });
+
+ // Tell the ASP.NET app what addresses we're listening on, so that it can proxy requests here
+ callback(null, {
+ Port: listener.address().port,
+ PublicPaths: normalizedPublicPaths
+ });
+ } catch (ex) {
+ callback(ex.stack, null);
+ }
+ });
+ },
+ err => callback(err.stack, null)
+ );
 }
 
 function removeLeadingSlash(str: string) {