From 422adf8557ce559c99f2d76417e506d37b4d61ae Mon Sep 17 00:00:00 2001 From: Suneel Varma Date: Thu, 18 May 2017 22:03:58 +0200 Subject: [PATCH 1/2] refactor(loader-webpack): refactored aysnc await code to use promises --- src/aurelia-loader-webpack.ts | 68 ++++++++++++++++++++--------------- 1 file changed, 39 insertions(+), 29 deletions(-) diff --git a/src/aurelia-loader-webpack.ts b/src/aurelia-loader-webpack.ts index 31c82a2..f930131 100644 --- a/src/aurelia-loader-webpack.ts +++ b/src/aurelia-loader-webpack.ts @@ -14,9 +14,10 @@ export class TextTemplateLoader { * @param entry The TemplateRegistryEntry to load and populate with a template. * @return A promise which resolves when the TemplateRegistryEntry is loaded with a template. */ - async loadTemplate(loader: Loader, entry: TemplateRegistryEntry) { - const text = await loader.loadText(entry.address); - entry.template = DOM.createTemplateFromMarkup(text); + loadTemplate(loader: Loader, entry: TemplateRegistryEntry) { + return loader.loadText(entry.address).then((text) => { + entry.template = DOM.createTemplateFromMarkup(text); + }) } } @@ -52,7 +53,7 @@ export class WebpackLoader extends Loader { loaderPlugins = Object.create(null) as { [name: string]: LoaderPlugin & { hot?: (moduleId: string) => void } }; modulesBeingLoaded = new Map>(); templateLoader: TextTemplateLoader; - hmrContext: { + hmrContext: { handleModuleChange(moduleId: string, hot: Webpack.WebpackHotModule): Promise, handleViewChange(moduleId: string): Promise }; @@ -63,27 +64,31 @@ export class WebpackLoader extends Loader { this.useTemplateLoader(new TextTemplateLoader()); this.addPlugin('template-registry-entry', { - fetch: async (moduleId: string) => { + fetch: (moduleId: string) => { // HMR: if (module.hot) { if (!this.hmrContext) { // Note: Please do NOT import aurelia-hot-module-reload statically at the top of file. // We don't want to bundle it when not using --hot, in particular in production builds. - // Webpack will evaluate the `if (module.hot)` above at build time + // Webpack will evaluate the `if (module.hot)` above at build time // and will include (or not) aurelia-hot-module-reload accordingly. const { HmrContext } = require('aurelia-hot-module-reload'); this.hmrContext = new HmrContext(this as any); } - module.hot.accept(moduleId, async () => { - await this.hmrContext.handleViewChange(moduleId); + module.hot.accept(moduleId, () => { + return this.hmrContext.handleViewChange(moduleId).then((resource) => { + return resource; + }); }); } const entry = this.getOrCreateTemplateRegistryEntry(moduleId); if (!entry.templateIsLoaded) { - await this.templateLoader.loadTemplate(this, entry); + return this.templateLoader.loadTemplate(this, entry).then(() => { + return entry; + }); } - return entry; + return Promise.resolve(entry); } } as LoaderPlugin); @@ -100,7 +105,7 @@ export class WebpackLoader extends Loader { }; } - async _import(address: string, defaultHMR = true) { + _import(address: string, defaultHMR = true) { const addressParts = address.split('!'); const moduleId = addressParts.splice(addressParts.length - 1, 1)[0]; const loaderPlugin = addressParts.length === 1 ? addressParts[0] : null; @@ -108,19 +113,21 @@ export class WebpackLoader extends Loader { if (loaderPlugin) { const plugin = this.loaderPlugins[loaderPlugin]; if (!plugin) { - throw new Error(`Plugin ${loaderPlugin} is not registered in the loader.`); + return Promise.reject(new Error(`Plugin ${loaderPlugin} is not registered in the loader.`)); } if (module.hot && plugin.hot) { module.hot.accept(moduleId, () => plugin.hot!(moduleId)); } - return await plugin.fetch(moduleId); + return plugin.fetch(moduleId).then((resource) => { + return resource; + }); } if (__webpack_require__.m[moduleId]) { if (defaultHMR && module.hot && this.hmrContext) { module.hot.accept(moduleId, () => this.hmrContext.handleModuleChange(moduleId, module.hot)); } - return __webpack_require__(moduleId); + return Promise.resolve(__webpack_require__(moduleId)); } const asyncModuleId = `async!${moduleId}`; @@ -131,10 +138,10 @@ export class WebpackLoader extends Loader { module.hot.accept(asyncModuleId, () => {}); } const callback = __webpack_require__(asyncModuleId) as (callback: (moduleExports: any) => void) => void; - return await new Promise(callback); + return new Promise(callback); } - throw new Error(`Unable to find module with ID: ${moduleId}`); + return Promise.reject(new Error(`Unable to find module with ID: ${moduleId}`)); } /** @@ -188,10 +195,10 @@ export class WebpackLoader extends Loader { * @param moduleId The module ID to load. * @return A Promise for the loaded module. */ - async loadModule(moduleId: string, defaultHMR = true) { + loadModule(moduleId: string, defaultHMR = true) { let existing = this.moduleRegistry[moduleId]; if (existing) { - return existing; + return Promise.resolve(existing); } let beingLoaded = this.modulesBeingLoaded.get(moduleId); if (beingLoaded) { @@ -199,10 +206,12 @@ export class WebpackLoader extends Loader { } beingLoaded = this._import(moduleId, defaultHMR); this.modulesBeingLoaded.set(moduleId, beingLoaded); - const moduleExports = await beingLoaded; - this.moduleRegistry[moduleId] = ensureOriginOnExports(moduleExports, moduleId); - this.modulesBeingLoaded.delete(moduleId); - return moduleExports; + // const moduleExports = await beingLoaded; + return beingLoaded.then((moduleExports) => { + this.moduleRegistry[moduleId] = ensureOriginOnExports(moduleExports, moduleId); + this.modulesBeingLoaded.delete(moduleId); + return moduleExports; + }) } /** @@ -219,13 +228,14 @@ export class WebpackLoader extends Loader { * @param url The url of the text file to load. * @return A Promise for text content. */ - async loadText(url: string) { - const result = await this.loadModule(url, false); - if (result instanceof Array && result[0] instanceof Array && result.hasOwnProperty('toString')) { - // we're dealing with a file loaded using the css-loader: - return result.toString(); - } - return result; + loadText(url: string) { + return this.loadModule(url,false).then((result) => { + if (result instanceof Array && result[0] instanceof Array && result.hasOwnProperty('toString')) { + // we're dealing with a file loaded using the css-loader: + return result.toString(); + } + return result; + }) } /** From 7e06aae58399bbacd6ae3da7ef847c210ddbcdd1 Mon Sep 17 00:00:00 2001 From: Suneel Varma Date: Thu, 18 May 2017 23:05:33 +0200 Subject: [PATCH 2/2] fixes for pull request comments --- src/aurelia-loader-webpack.ts | 23 ++++++++--------------- 1 file changed, 8 insertions(+), 15 deletions(-) diff --git a/src/aurelia-loader-webpack.ts b/src/aurelia-loader-webpack.ts index f930131..ad54ba6 100644 --- a/src/aurelia-loader-webpack.ts +++ b/src/aurelia-loader-webpack.ts @@ -17,7 +17,7 @@ export class TextTemplateLoader { loadTemplate(loader: Loader, entry: TemplateRegistryEntry) { return loader.loadText(entry.address).then((text) => { entry.template = DOM.createTemplateFromMarkup(text); - }) + }); } } @@ -76,17 +76,13 @@ export class WebpackLoader extends Loader { this.hmrContext = new HmrContext(this as any); } module.hot.accept(moduleId, () => { - return this.hmrContext.handleViewChange(moduleId).then((resource) => { - return resource; - }); + return this.hmrContext.handleViewChange(moduleId); }); } const entry = this.getOrCreateTemplateRegistryEntry(moduleId); if (!entry.templateIsLoaded) { - return this.templateLoader.loadTemplate(this, entry).then(() => { - return entry; - }); + return this.templateLoader.loadTemplate(this, entry).then(() => entry); } return Promise.resolve(entry); } @@ -118,9 +114,7 @@ export class WebpackLoader extends Loader { if (module.hot && plugin.hot) { module.hot.accept(moduleId, () => plugin.hot!(moduleId)); } - return plugin.fetch(moduleId).then((resource) => { - return resource; - }); + return plugin.fetch(moduleId); } if (__webpack_require__.m[moduleId]) { @@ -206,12 +200,11 @@ export class WebpackLoader extends Loader { } beingLoaded = this._import(moduleId, defaultHMR); this.modulesBeingLoaded.set(moduleId, beingLoaded); - // const moduleExports = await beingLoaded; - return beingLoaded.then((moduleExports) => { + return beingLoaded.then(moduleExports => { this.moduleRegistry[moduleId] = ensureOriginOnExports(moduleExports, moduleId); this.modulesBeingLoaded.delete(moduleId); return moduleExports; - }) + }); } /** @@ -229,13 +222,13 @@ export class WebpackLoader extends Loader { * @return A Promise for text content. */ loadText(url: string) { - return this.loadModule(url,false).then((result) => { + return this.loadModule(url, false).then((result) => { if (result instanceof Array && result[0] instanceof Array && result.hasOwnProperty('toString')) { // we're dealing with a file loaded using the css-loader: return result.toString(); } return result; - }) + }); } /**