[bug?]compiler.resolvers.normal.plugin is not a function

[Zaynex]

Hi, angular-cli Team:
when I update my webpack and ngtools-webpack, I meet this problem.

Environment

"webpack": "^4.0.0-beta.1",
"webpack-cli": "^2.0.6",
"@ngtools/webpack": "^1.10.2",

node v8.9.0
macOS 10.13.3

Bug

myproject/node_modules/webpack-cli/bin/webpack.js:439
throw err;
TypeError: compiler.resolvers.normal.plugin is not a function
at compiler.plugin (myproject/node_modules/@ngtools/webpack/src/plugin.js:336:39)

So I check the file plugin.js, it looks like this:

compiler.plugin('after-resolvers', (compiler) => {
            // Virtual file system.
            // Wait for the plugin to be done when requesting `.ts` files directly (entry points), or
            // when the issuer is a `.ts` file.
            compiler.resolvers.normal.plugin('before-resolve', (request, cb) => {
                if (this.done && (request.request.endsWith('.ts')
                    || (request.context.issuer && request.context.issuer.endsWith('.ts')))) {
                    this.done.then(() => cb(), () => cb());
                }
                else {
                    cb();
                }
            });
        });

I console the resolvers.normal object, and there is plugins as property in resolvers.normal rather than plugin.
So I fix it as plugins and it runs success.
But it shows warning:

(node:5729) DeprecationWarning: webpack: Using compiler.resolvers.normal is deprecated.
Use compiler.resolverFactory.plugin("resolver normal", resolver => {
  resolver.apply(/* ... */);
}); instead.

I can't find plugin.js in @ngtool-webpack/src. I guess the error maybe in

angular-cli/packages/@ngtools/webpack/src/angular_compiler_plugin.ts

Lines 643 to 659 in 9c4f9e9

	compiler.hooks.afterResolvers.tap('angular-compiler', (compiler: any) => {
	compiler.hooks.normalModuleFactory.tap('angular-compiler', (nmf: any) => {
	// Virtual file system.
	// TODO: consider if it's better to remove this plugin and instead make it wait on the
	// VirtualFileSystemDecorator.
	// Wait for the plugin to be done when requesting `.ts` files directly (entry points), or
	// when the issuer is a `.ts` or `.ngfactory.js` file.
	nmf.hooks.beforeResolve.tapAsync('angular-compiler', (request: any, callback: any) => {
	if (this.done && (request.request.endsWith('.ts')
	|| (request.context.issuer && /\.ts|ngfactory\.js$/.test(request.context.issuer)))) {
	this.done.then(() => callback(null, request), () => callback(null, request));
	} else {
	callback(null, request);
	}
	});
	});
	});

Looking forward to your reply!

[clydin]

The version being used only supports up to webpack 3.x. If you’d like to try webpack 4, you can try the 6.0 beta of @ngtools/webpack. Note that 6.0 requires a minimum angular version of 5.

[Zaynex]

thanks! @clydin
But my project still use angular version of 2.4. Are there other solutions?

[penmav]

@clydin the 6.0 beta of what?

[clydin]

The only two options are to either stay with Webpack 3.x; or update the project to Angular 5.x (or the upcoming 6.x). There are numerous performance and feature enhancements in the newer Angular versions. Those alone may provide justification to migrate the application.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}