Error running app built with CLI and Webpack 4

[bhalperin]

Hi,

I built an Aurelia app using CLI and Webpack. Then upgraded both. Running au run or au run --env dev --watch I get the following in my console:

d:\projects\aurelia\aurelia-app\node_modules\tapable\lib\Tapable.js:63
                throw new Error(`Plugin could not be registered at '${name}'. Hook was not found.\n` +
        ^
Error: Plugin could not be registered at 'module'. Hook was not found.
BREAKING CHANGE: There need to exist a hook at 'this.hooks'. To create a compatiblity layer for this hook, hook into 'this._pluginCompat'.
    at Compiler.plugin (d:\projects\aurelia\aurelia-app\node_modules\tapable\lib\Tapable.js:63:9)
    at Compiler.deprecated [as plugin] (internal/util.js:52:15)
    at ModulesInRootPlugin.apply (d:\projects\aurelia\aurelia-app\node_modules\enhanced-resolve\lib\ModulesInRootPlugin.js:15:11)
    at Compiler.apply (d:\projects\aurelia\aurelia-app\node_modules\tapable\lib\Tapable.js:71:16)
    at Compiler.deprecated [as apply] (internal/util.js:52:15)
    at PathPlugin.apply (d:\projects\aurelia\aurelia-app\node_modules\awesome-typescript-loader\src\paths-plugin.ts:120:13)
    at webpack (d:\projects\aurelia\aurelia-app\node_modules\webpack\lib\webpack.js:37:12)
    at Object.<anonymous> (d:\projects\aurelia\aurelia-app\aurelia_project\tasks\build.ts:19:16)
    at Module._compile (module.js:635:30)
    at Object.require.extensions..ts (d:\projects\aurelia\aurelia-app\node_modules\aurelia-cli\lib\project.js:239:19)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (d:\projects\aurelia\aurelia-app\aurelia_project\tasks\run.ts:3:15)

I read about the changes in Webpack 4 that break compatibility with plugins/loaders. But not sure if awesome-typescript-loader is compatible and if this loader causes the problem.

node 8.9.1
npm 5.7.1
aurelia-cli 0.33.1
webpack 4.4.1
awesome-typescript-loader 4.0.1

TIA for any help,
Benny

[mttmccb]

When I upgraded I just updated to the tsloader and didn’t run into too many problems, mainly just handling the paths was a big different. Nothing too different from what the CLI generated.

0.33.1 - Updating an existing project

I try to update to the latest CLI when it comes out and this one in particular looked worth it because of the Webpack 4 support. I wasn’t optimistic is would work right away but it wasn’t terrible. Here’s how I d did it. My project is a .NET core app using Typescript and PostCSS. Step 1 Make sure the project is in source control! Step 2 Update aurelia-cli npm i aurelia-cli -g It didn’t update so deleted node_modules so it wouldn’t pickup my local aurelia-cli. Step 3 Rerun the build using a…

[bhalperin]

Thanks @mttmccb. I am using the CLI out of the box, and it is using awesome-typescript-loader. I want to understand first which module is causing the problem I described.

[Alexander-Taran]

@bhalperin

using awesome-typescript-loader.

that was before cli 0.33.1
projects scaffolded with latest use ts-loader… because at- was not ready on webpack4 launch

scaffold a new project with CLI and merge the differences…

[bhalperin]

@Alexander-Taran thanks for your reply (and sorry for the time it took me). I finally decided to stay with the skeleton project I used at the time, and replaced at- with ts-loader, which solved the problem. See my SO post too.