withNx changes broke compatibility with other NextJS plugins

[raphzandrade]

Current Behavior

Apps that use other Next.js plugins, such as remove-imports [ref], may not function properly with the latest version of Nx.

Example

Here's an example of a library component import failure that occurred when using a previously functioning plugin:

The next.config.ts file of the application:

Removing the plugin resolves the error.

Expected Behavior

It should continue to function with the plugins that were previously operational.

GitHub Repo

https://github.com/raphzandrade/next-errors

Steps to Reproduce

1. Add any plugin to a NextJS application;
2. Make sure it uses any component imported from a library;
3. Serve the application.

Nx Report

Node : 18.13.0
   OS   : darwin x64
   pnpm : 7.26.2
   
   nx                      : 15.9.2
   @nrwl/js                : 15.9.2
   @nrwl/jest              : 15.9.2
   @nrwl/linter            : 15.9.2
   @nrwl/workspace         : 15.9.2
   @nrwl/cypress           : 15.9.2
   @nrwl/eslint-plugin-nx  : 15.9.2
   @nrwl/next              : 15.9.2
   @nrwl/react             : 15.9.2
   @nrwl/nx-cloud          : 15.3.5
   typescript              : 4.9.5

Failure Logs

No response

Additional Information

No response

[lourd]

Related issue at #16141 with a fix linked.

[jaysoo]

I think we need to add a composePlugins util similar to @nrwl/webpack so these things are easier to do. The example outlined here is how it can be done for now: #15794 (comment).

[jaysoo]

We'll add something to Nx 16 to make this easier to work with:

const plugins = [
  // Add as many plugins here
  withMDX,
  withNx
  // ...
];

// The composed function will know how to handle normal plugins and plugins that return an async function (e.g. `withNx`).
module.exports = composePlugins(...plugins)({
  // normal next.js config
});

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.