nextjs 11: Runtime.ImportModuleError: Error: Cannot find module '../chunks/9033.js'

[amuttsch]

Describe the bug
When deploying our website using next.js 11.0.1 we get the following error:

{
   "errorType":"Runtime.ImportModuleError",
   "errorMessage":"Error: Cannot find module '../chunks/9033.js'\nRequire stack:\n- /var/task/out_functions/next_index/next_index.js\n- /var/task/next_index.js\n- /var/runtime/UserFunction.js\n- /var/runtime/index.js",
   "trace":[
      "Runtime.ImportModuleError: Error: Cannot find module '../chunks/9033.js'",
      "Require stack:",
      "- /var/task/out_functions/next_index/next_index.js",
      "- /var/task/next_index.js",
      "- /var/runtime/UserFunction.js",
      "- /var/runtime/index.js",
      "    at _loadUserApp (/var/runtime/UserFunction.js:100:13)",
      "    at Object.module.exports.load (/var/runtime/UserFunction.js:140:17)",
      "    at Object.<anonymous> (/var/runtime/index.js:43:30)",
      "    at Module._compile (internal/modules/cjs/loader.js:999:30)",
      "    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)",
      "    at Module.load (internal/modules/cjs/loader.js:863:32)",
      "    at Function.Module._load (internal/modules/cjs/loader.js:708:14)",
      "    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:60:12)",
      "    at internal/main/run_main_module.js:17:47"
   ]
}

Using next.js 10.x the deployment works fine. We have also updated webpack to v5, as we used v4 before.

Building and running the website with target: "server" works locally.

Additionally, I see the 9033.js in the out_functions folder of the executed function, but it seems like it is not bundled in the actual netlify bundle.

If you need any additional information, please let me know.

To Reproduce
See repo with example code: https://github.com/amuttsch/nextjs11-netlify-module-not-found

We deploy our website using the netlify cli:

$ yarn run netlify:build && yarn run netlify:deploy

Expected behavior
The website to load properly :-)

Versions

• Next.js: 11.0.1
• plugin (if installed at fixed version): 3.6.2

If you're using the CLI to build

• OS: Linux
• netlify/cli version: 4.1.2

If you're using file-based installation

• netlify.toml:

[build]
    command   = "yarn run build:serverless"
    functions = "out_functions"
    publish   = "out_publish"

[functions]
    node_bundler = "esbuild"
    external_node_modules = ["@ampproject/toolbox-optimizer"]

[[plugins]]
    package = "@netlify/plugin-nextjs"

[context.branch.environment]
    # Environment variable substitution is not supported, therfore we cannot
    # set SITE_ALIAS here.
    NEXT_SERVERLESS = "true"
    NODE_ENV = "production"

[dev]
    functions = "out_functions"
    publish   = "out_publish"
    # We manually set the framework to static, otherwise Netlify automatically
    # detects NextJS and redirects do not work.
    # Read more: https://github.com/netlify/cli/blob/master/docs/netlify-dev.md#project-detection
    framework = "#static"

[amuttsch]

I tried disabling the esbuild bundler, this seems to fix the issue 🤔

[amuttsch]

And I got a (non) working example repo here: https://github.com/amuttsch/nextjs11-netlify-module-not-found

[ascorbic]

Hi @amuttsch
This is an issue with esbuild and its handling of dynamic imports. We have a fix, but it's currently behind a feature flag. Try setting the env var NETLIFY_EXPERIMENTAL_PROCESS_DYNAMIC_IMPORTS to true and see if that fixes it.

[amuttsch]

@ascorbic Thanks for the quick reply, adding the env var works 🎉

Do you have any timeframe when this feature will be stable?

[ascorbic]

It should be soon. @eduardoboucas is just making sure that it's stable before unflagging it.

[lindsaylevine]

hey @amuttsch! since the feature flag works for you and this is a duplicate of #337, i'm going to close this in favor of that! please track there :) ty!!! <3