Not able to use dynamic import in next.config.js when using custom plugins with swc

[eesdil]

Current Behavior

We use "remark-gfm" plugin (which esm only package) in the nextjs application. Therefore we use dynamic impot in the next.config.js file. We have a custom docker plugin which before the 15.7.0-beta.6 was working fine.

With that release this stopped working, and giving an error message:

Error [ERR_REQUIRE_ESM]: require() of ES Module /home/kcs/Projects/test/dynamic/node_modules/remark-gfm/index.js from /home/kcs/Projects/test/dynamic/apps/next-app/next.config.js not supported.
Instead change the require of index.js in /home/kcs/Projects/test/dynamic/apps/next-app/next.config.js to a dynamic import() which is available in all CommonJS modules.
    at Object.newLoader [as .js] (/home/kcs/Projects/test/dynamic/node_modules/pirates/lib/index.js:141:7)
    at /home/kcs/Projects/test/dynamic/apps/next-app/next.config.js:54:89
    at async module.exports (/home/kcs/Projects/test/dynamic/apps/next-app/next.config.js:54:18)
    at async Object.normalizeConfig (/home/kcs/Projects/test/dynamic/node_modules/next/dist/server/config-shared.js:127:12)
    at async loadConfig (/home/kcs/Projects/test/dynamic/node_modules/next/dist/server/config.js:78:28)

The problem why this is happening is, because we use dynamic import() in the next.config.js file. And during the compilation this is replaced by require() statement.

This is failing only in case of using swc. There was a change in the code which replaced the compilation settings, so I reckon that has something to do with it.

Expected Behavior

Able to use dynamic import() in next.config.js file.

GitHub Repo

https://github.com/eesdil/dynamic

Steps to Reproduce

1. get the github repo git@github.com:eesdil/dynamic.git
2. cd dynamic
3. run npm i
4. run npx nx run next-app:fail

Nx Report

Node : 18.14.1
   OS   : linux x64
   npm  : 9.3.1

   nx                      : 15.7.2
   @nrwl/jest              : 15.7.2
   @nrwl/linter            : 15.7.2
   @nrwl/workspace         : 15.7.2
   @nrwl/cli               : 15.7.2
   @nrwl/cypress           : 15.7.2
   @nrwl/devkit            : 15.7.2
   @nrwl/eslint-plugin-nx  : 15.7.2
   @nrwl/js                : 15.7.2
   @nrwl/next              : 15.7.2
   @nrwl/react             : 15.7.2
   @nrwl/tao               : 15.7.2
   @nrwl/webpack           : 15.7.2
   typescript              : 4.8.4
   ---------------------------------------
   Local workspace plugins:
         @myorg/plugin

Failure Logs

No response

Additional Information

this snippet is also failing:

const { register } = require('@swc-node/register/register');
const ts = require('typescript');

register({
  lib: ['es2021'],
  module: ts.ModuleKind.CommonJS,
  target: ts.ScriptTarget.ES2021,
  esModuleInterop: true,
  skipLibCheck: true,
});

require('./next.config')();

[ndcunningham]

Please, update to the latest version of Nx or you can test it out with your repo by running nx migrate latest

[github-actions[bot]]

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.