Aurelia template fails to build with WebPack 4

[veikkoeeva]

I opened this originally in https://github.com/aspnet/JavaScriptServices/issues/1499, but I'm not sure which repository is the right one. The issue replicated:

Functional impact

ASP.NET Core 2.0 application fails to start with the following error messages printed to the console:

fail: Microsoft.AspNetCore.NodeServices[0]
      (node:19268) DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly 
fail: Microsoft.AspNetCore.NodeServices[0]
      (node:19268) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead

Minimal repro steps

Create ASP.NET Core 2.0 application "normally" and do Install-Package Microsoft.AspNetCore.SpaServices -Version 2.0.2 and when yarn add webpack@next webpack-cli --dev or npm install webpack@next webpack-cli --save-dev has been done to update to WebPack 4.0.

Expected result

One could run the system without taking specific extra steps. :)

Please provide quickly an update Nuget package as it appears (hearsay) many are transitioning to WebPack 4.0 as it appears to be stable enough and it seems like it's encouraged to be used to weed out bugs.

Actual result

The applications fails to start in

app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions

as described in Functional impact. Further, the exception trace (in this case Aurelia) is as follows

TypeError: Cannot read property 'bind' of undefined
    at compiler.plugin (C:\projects\AureliaDemo\AureliaDemo\node_modules\aurelia-webpack-plugin\dist\ModuleDependenciesPlugin.js:36:63)
    at _err0 (eval at create (C:\projects\AureliaDemo\AureliaDemo\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:12:1)
    at compiler.hooks.beforeCompile.tapAsync (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\DllReferencePlugin.js:40:12)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\projects\AureliaDemo\AureliaDemo\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:7:1)
    at AsyncSeriesHook.lazyCompileHook [as _callAsync] (C:\projects\AureliaDemo\AureliaDemo\node_modules\tapable\lib\Hook.js:35:21)
    at Compiler.compile (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\Compiler.js:427:28)
    at compiler.hooks.watchRun.callAsync.err (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\Watching.js:74:18)
    at _err0 (eval at create (C:\projects\AureliaDemo\AureliaDemo\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:11:1)
    at compilerInvalid (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack-dev-middleware\lib\Shared.js:161:5)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\projects\AureliaDemo\AureliaDemo\node_modules\tapable\lib\HookCodeFactory.js:24:12), <anonymous>:7:1)
    at AsyncSeriesHook.lazyCompileHook [as _callAsync] (C:\projects\AureliaDemo\AureliaDemo\node_modules\tapable\lib\Hook.js:35:21)
    at Watching._go (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\Watching.js:39:32)
    at Watching.compiler.readRecords.err (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\Watching.js:31:9)
    at Compiler.readRecords (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\Compiler.js:324:11)
    at new Watching (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\Watching.js:28:17)
    at Compiler.watch (C:\projects\AureliaDemo\AureliaDemo\node_modules\webpack\lib\Compiler.js:161:10)

not tested, but could be the same for other SPA templates too.

Further technical details

Windows 10, VS 2017 15.5.5, latest WebPack (as described) and latest Yarn all packages either upgraded or not. The WebPack 4.0 Announcement.

[Eilon]

@SteveSandersonMS thoughts?

[SteveSandersonMS]

Duplicate of https://github.com/aspnet/JavaScriptServices/issues/1499

[veikkoeeva]

I'll add here also due to the referenced issue about Aurelia that @jods4 writes in http://aurelia.io/

We released aurelia-webpack-plugin@3.0.0-rc.1 which is compatible with (and requires) Webpack 4. The major version bump is to prevent an automatic upgrade from 2.0.0-rc.5, which you should continue to use if you're still on Webpack 3.

I'll leave here for the benefit of search engine queries. :)