@module-federation/[email protected] module not found error #1961

Capricair · 2024-01-15T02:57:46Z

Describe the bug

@module-federation/[email protected] throw module not found error when start dev server, but the same code works fine in codesandbox, reinstall it didn't work either, but version 8.1.3 works fine.

dependencies:

next: 12.3.1
react: 17.0.2
react-dom: 17.0.2

PS E:\work\app-store> npm run dev

> [email protected] dev
> cross-env NODE_ENV=development next dev -p 3001

ready - started server on 0.0.0.0:3001, url: http://localhost:3001
info  - Loaded env from E:\work\app-store\.env
NEXT_PUBLIC_BASE_PATH: undefined
Error: Cannot find module 'E:\work\app-store\node_modules\next\dist\compiled\lib\util\makeSerializable'
Require stack:
- E:\work\app-store\node_modules\@module-federation\enhanced\dist\src\lib\container\ContainerExposedDependency.js
- E:\work\app-store\node_modules\@module-federation\enhanced\dist\src\lib\container\ContainerEntryModule.js
- E:\work\app-store\node_modules\@module-federation\enhanced\dist\src\lib\container\HoistContainerReferencesPlugin.js
- E:\work\app-store\node_modules\@module-federation\enhanced\dist\src\wrapper\HoistContainerReferencesPlugin.js
- E:\work\app-store\node_modules\@module-federation\enhanced\dist\src\index.js
- E:\work\app-store\node_modules\@module-federation\nextjs-mf\dist\src\internal.js
- E:\work\app-store\node_modules\@module-federation\nextjs-mf\dist\src\plugins\NextFederationPlugin\next-fragments.js
- E:\work\app-store\node_modules\@module-federation\nextjs-mf\dist\src\plugins\NextFederationPlugin\index.js
- E:\work\app-store\node_modules\@module-federation\nextjs-mf\dist\src\index.js
- E:\work\app-store\next.config.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1077:15)
    at mod._resolveFilename (E:\work\app-store\node_modules\next\dist\build\webpack\require-hook.js:27:32)
    at mod._resolveFilename (E:\work\app-store\node_modules\next\dist\build\webpack\require-hook.js:27:32)
    at mod._resolveFilename (E:\work\app-store\node_modules\next\dist\build\webpack\require-hook.js:27:32)
    at Module._load (node:internal/modules/cjs/loader:922:27)
    at Module.require (node:internal/modules/cjs/loader:1143:19)
    at require (node:internal/modules/cjs/helpers:119:18)
    at Object.<anonymous> (E:\work\app-store\node_modules\@module-federation\enhanced\dist\src\lib\container\ContainerExposedDependency.js:8:26)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'E:\\work\\app-store\\node_modules\\@module-federation\\enhanced\\dist\\src\\lib\\container\\ContainerExposedDependency.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\enhanced\\dist\\src\\lib\\container\\ContainerEntryModule.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\enhanced\\dist\\src\\lib\\container\\HoistContainerReferencesPlugin.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\enhanced\\dist\\src\\wrapper\\HoistContainerReferencesPlugin.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\enhanced\\dist\\src\\index.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\nextjs-mf\\dist\\src\\internal.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\nextjs-mf\\dist\\src\\plugins\\NextFederationPlugin\\next-fragments.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\nextjs-mf\\dist\\src\\plugins\\NextFederationPlugin\\index.js',
    'E:\\work\\app-store\\node_modules\\@module-federation\\nextjs-mf\\dist\\src\\index.js',
    'E:\\work\\app-store\\next.config.js'
  ]
}

Reproduction

Used Package Manager

npm

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (8) x64 Intel(R) Core(TM) i3-10100 CPU @ 3.60GHz
    Memory: 5.66 GB / 15.67 GB
  Binaries:
    Node: 18.18.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.21 - C:\Program Files\nodejs\yarn.CMD
    npm: 9.8.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (120.0.2210.133)
    Internet Explorer: 11.0.19041.3636

Validations

Read the docs.
Read the common issues list.
Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Module federation issue and not a framework-specific issue.
The provided reproduction is a minimal reproducible example of the bug.

The text was updated successfully, but these errors were encountered:

gryp17 · 2024-01-15T20:44:10Z

Same issue here. Only managed to get it working using next 13.4.4 and @module-federation/nextjs-mf 6.0.4. Upgrading nextjs-mf to version 8+ causes the same module not found error. Even this demo throws the same error message.

yunusileri · 2024-01-18T06:45:07Z

I have that same problem. Version 8.1.3 works in dev mode, it does not work after build. When I upgrade to a higher version, I get a Module not found error. The only version I can run right now is 5.12.11.

richardklotz · 2024-01-18T16:48:10Z

I found that there are two (at least) issues on windows. One is with how the webpack path is calculated and the other is the entry file located at node_modules\.federation. Fixing both of those allows the app to start.

Running on Windows

normalizeWebpackPath:

=========webpackErrLocation=============== at webpack (C:\code\TestApp\node_modules\webpack\lib\webpack.js:167:32)
=========webpackLocationWithDetail======== C:\code\TestApp\node_modules\webpack\lib\webpack.js:167:32
=========webpackPath====================== C

node_modules\.federation
\ needs escaped

import federation from 'C:\code\TestApp\node_modules\@module-federation\webpack-bundler-runtime\dist\index.cjs.js';
import plugin_0 from 'C:\code\TestApp\node_modules\@module-federation\nextjs-mf\dist\src\plugins\container\runtimePlugin.js';

__webpack_require__.federation = { ...federation, ...__webpack_require__.federation };
if (!__webpack_require__.federation.instance) {
	__webpack_require__.federation.initOptions.plugins = ([
		plugin_0(),
	])
	__webpack_require__.federation.instance = __webpack_require__.federation.runtime.init(__webpack_require__.federation.initOptions);
	if (__webpack_require__.federation.attachShareScopeMap) {
		__webpack_require__.federation.attachShareScopeMap(__webpack_require__)
	}
	if (__webpack_require__.federation.installInitialConsumes) {
		__webpack_require__.federation.installInitialConsumes()
	}
}

Running on Windows WSL

normalizeWebpackPath:

=========webpackErrLocation===============  at webpack (/root/code/TestApp/node_modules/webpack/lib/webpack.js:167:32)
=========webpackLocationWithDetail======== /root/code/TestApp/node_modules/webpack/lib/webpack.js:167:32
=========webpackPath====================== /root/code/TestApp/node_modules/webpack/lib/webpack.js`

node_modules\.federation

import federation from '/root/code/TestApp/node_modules/@module-federation/nextjs-mf/node_modules/@module-federation/webpack-bundler-runtime/dist/index.cjs.js';
import plugin_0 from '/root/code/TestApp/node_modules/@module-federation/nextjs-mf/dist/src/plugins/container/runtimePlugin.js';

__webpack_require__.federation = {...federation,...__webpack_require__.federation};
if(!__webpack_require__.federation.instance){
	__webpack_require__.federation.initOptions.plugins = ([
		plugin_0(),
	])
	__webpack_require__.federation.instance = __webpack_require__.federation.runtime.init(__webpack_require__.federation.initOptions);
	if(__webpack_require__.federation.attachShareScopeMap){
		__webpack_require__.federation.attachShareScopeMap(__webpack_require__)
	}
	if(__webpack_require__.federation.installInitialConsumes){
		__webpack_require__.federation.installInitialConsumes()
	}
}

ScriptedAlchemy · 2024-01-20T08:26:55Z

Looks like this is windows related.
#1997

senuravihanjayadeva · 2024-01-22T11:51:36Z

Same issue here

armedi · 2024-01-26T03:21:41Z

Same issue here.
We are trying to migrate our CRA based apps to Next.js. Majority of team members are using windows

Icammarano · 2024-02-06T13:50:20Z

I have same issue in linux, Nextjs 14.0.1, module-federation 8.1.10 and webpack 5.90.1. Need the solution for this error

fgh151 · 2024-02-07T10:25:39Z

I have same issue in linux, Nextjs 14.1.0, module-federation 8.1.10 and webpack 5.90.1. Need the solution for this error

renan-britz-mgm · 2024-02-11T18:47:40Z

Hey everyone, remember to edit your package.json scripts like below, otherwise you'll get the Cannot find module [...]makeSerializable error:

"scripts": {
  "dev": "rimraf .next && NEXT_PRIVATE_LOCAL_WEBPACK=true next dev",
  "build": "NEXT_PRIVATE_LOCAL_WEBPACK=true next build"
  // ...
}

NEXT_PRIVATE_LOCAL_WEBPACK=true is required.

carlosfvp · 2024-02-15T06:05:48Z

Hey everyone, remember to edit your package.json scripts like below, otherwise you'll get the Cannot find module [...]makeSerializable error:
"scripts": {
  "dev": "rimraf .next && NEXT_PRIVATE_LOCAL_WEBPACK=true next dev",
  "build": "NEXT_PRIVATE_LOCAL_WEBPACK=true next build"
  // ...
}
NEXT_PRIVATE_LOCAL_WEBPACK=true is required.

this doesn't fix the makeSerializable error

mtls-david-devargas · 2024-02-15T14:29:03Z

same issue here

jynzo94 · 2024-02-15T20:07:41Z

I receive this error too.
I have to start new project with nextjs and module federation. Any ideas how to proceed?

ScriptedAlchemy · 2024-03-07T05:31:33Z

try latest version. If windows user use WSL. you can try .env as well and set it in there

newmercer · 2024-03-11T02:22:53Z

@ScriptedAlchemy I'm on 5.12.7 and wanted to upgrade it to 8.2.2.
Getting below error with Module Not Found

I have next 13, react 18 installed.

semonec · 2024-03-13T14:44:52Z

@ScriptedAlchemy Same error

nextjs: 14.1.0
@module-federation/nextjs-mf: 8.2.2
macOS: 13.6.4
node: v20.9.0 (same as v18, v20.10.0)

script from package.json

    "dev": "rm -rf .next && NEXT_PRIVATE_LOCAL_WEBPACK=true next dev",

next.config.mjs

const moduleFederationConfig = {
  name: 'commonHost',
  remotes: {
    homepage: "homepage@http://localhost:3001/remoteEntry.js"
  },
  filename: 'static/chunks/remoteEntry.js',
  exposes: {},
  shared: {},
  extraOptions: {},
}

const nextConfig = {
  env,
  reactStrictMode: false,
  images: {
    unoptimized: true, // Disables the default behavior of Next.js to automatically optimize images for SSG
  },
  // output: 'export',
  webpack(config, options) {
    if (!options.isServer) {
      config.plugins.push(new NextFederationPlugin(moduleFederationConfig))
    }
    return config
  },
}

Component

import dynamic from 'next/dynamic';

const Component = dynamic(()=> {
    const home =  import('homepage/Homepage')
    console.log(home)
}, {
    ssr: false,
    loading: () => <p>loading...</p>
})

const home = () => {
    return (
        <div>
            <Component />
        </div>
    )
}

export default home

It says,

  ⨯ ./src/pages/homepage.tsx:5:18
 Module not found: Can't resolve 'homepage/Homepage'
   3 |
   4 | const Component = dynamic(()=> {
 > 5 |     const home =  import('homepage/Homepage')
     |                  ^
   6 |     console.log(home)
   7 | }, {
   8 |     ssr: false,

semonec · 2024-03-13T14:47:36Z

when I enable webpack config push in server case,
it shows error like below

Import trace for requested module:
external "homepage@http://localhost:3001/remoteEntry.js"
remote homepage/Homepage
[ Module Federation Manifest Plugin ] Manifest Link: /_next/mf-manifest.json
 ⚠ external "homepage@http://localhost:3001/remoteEntry.js"
The generated code contains 'async/await' because this module is using "external script".
However, your target environment does not appear to support 'async/await'.
As a result, the code may not run as expected or may cause runtime errors.

ScriptedAlchemy · 2024-03-18T12:18:38Z

Yeah when enabled server plugin push, that external warning is fine. It works.

ScriptedAlchemy · 2024-03-18T12:19:42Z

@ScriptedAlchemy I'm on 5.12.7 and wanted to upgrade it to 8.2.2.

Getting below error with Module Not Found

I have next 13, react 18 installed.

Set env var like all my examples show on package json scripts. Next private local webpack or whatever it's called. That fixes serializeable error

prakashmallow · 2024-04-12T01:54:17Z

@ScriptedAlchemy I'm also facing the same issue with Nextjs 14.1.4 and module-federation 8.3.3

Rajashekhar-Reddy · 2024-04-27T13:34:45Z

Tried in ubuntu wsl, but still getting the same error

[email protected] dev cross-env NODE_ENV=development next dev -p 3001

ready - started server on 0.0.0.0:3001, url: http://localhost:3001 info - Loaded env from E:\work\app-store\.env NEXT_PUBLIC_BASE_PATH: undefined Error: Cannot find module 'E:\work\app-store\node_modules\next\dist\compiled\lib\util\makeSerializable'

Require stack:

E:\work\app-store\node_modules@module-federation\enhanced\dist\src\lib\container\ContainerExposedDependency.js
E:\work\app-store\node_modules@module-federation\enhanced\dist\src\lib\container\ContainerEntryModule.js
E:\work\app-store\node_modules@module-federation\enhanced\dist\src\lib\container\HoistContainerReferencesPlugin.js
E:\work\app-store\node_modules@module-federation\enhanced\dist\src\wrapper\HoistContainerReferencesPlugin.js
E:\work\app-store\node_modules@module-federation\enhanced\dist\src\index.js
E:\work\app-store\node_modules@module-federation\nextjs-mf\dist\src\internal.js
E:\work\app-store\node_modules@module-federation\nextjs-mf\dist\src\plugins\NextFederationPlugin\next-fragments.js
E:\work\app-store\node_modules@module-federation\nextjs-mf\dist\src\plugins\NextFederationPlugin\index.js
E:\work\app-store\node_modules@module-federation\nextjs-mf\dist\src\index.js
E:\work\app-store\next.config.js
at Module._resolveFilename (node:internal/modules/cjs/loader:1077:15)

But suprisingly v8.1.3 works well but having a bulk of warnings

shinyuna · 2024-04-28T07:54:37Z

Same error 🥲

next.js: 13.4.9
@module-federation/nextjs-mf: 8.3.9

👆 It works.

next.js: 14.2.3
@module-federation/nextjs-mf: 8.3.9

👆 It doesn't work. The next server is returning a 500 error.

prakashmallow · 2024-04-29T04:37:30Z

Same error 🥲

next.js: 13.4.9

@module-federation/nextjs-mf: 8.3.9

👆 It works.

next.js: 14.2.3

@module-federation/nextjs-mf: 8.3.9

👆 It doesn't work. The next server is returning a 500 error.

Try with @module-federation/nextjs-mf: 8.1.0 and next.js: 14.2.3.

sreeharinm · 2024-04-29T10:56:28Z

⚠ external "shop@http://localhost:3001/_next/static/chunks/remoteEntry.js"
The generated code contains 'async/await' because this module is using "external script".
However, your target environment does not appear to support 'async/await'.
As a result, the code may not run as expected or may cause runtime errors.

Import trace for requested module:
external "shop@http://localhost:3001/_next/static/chunks/remoteEntry.js"
remote shop/test

HANYUNSEONG · 2024-05-02T06:30:34Z

Same error 😢

next v12.2.4
@module-federation/nextjs-mf: 8.3.12
mac os

add NEXT_PRIVATE_LOCAL_WEBPACK=true line in .env.local

"dev": "rm -rf .next && NEXT_PRIVATE_LOCAL_WEBPACK=true next dev",

-> Error: Cannot find module /node_modules/next/dist/compiled/lib/util/makeSerializable

ScriptedAlchemy · 2024-05-02T07:27:27Z

⚠ external "shop@http://localhost:3001/_next/static/chunks/remoteEntry.js"

The generated code contains 'async/await' because this module is using "external script".

However, your target environment does not appear to support 'async/await'.

As a result, the code may not run as expected or may cause runtime errors.

Import trace for requested module:

external "shop@http://localhost:3001/_next/static/chunks/remoteEntry.js"

remote shop/test

Not an error or issue.

ScriptedAlchemy · 2024-05-02T07:29:04Z

Same error 😢

next v12.2.4

@module-federation/nextjs-mf: 8.3.12

mac os

add NEXT_PRIVATE_LOCAL_WEBPACK=true line in .env.local

"dev": "rm -rf .next && NEXT_PRIVATE_LOCAL_WEBPACK=true next dev",

-> Error: Cannot find module /node_modules/next/dist/compiled/lib/util/makeSerializable

Install webpack. Not sure if next 12 allows the override var or not.

HANYUNSEONG · 2024-05-02T09:02:49Z

Same error 😢

next v12.2.4

@module-federation/nextjs-mf: 8.3.12

mac os

add NEXT_PRIVATE_LOCAL_WEBPACK=true line in .env.local
"dev": "rm -rf .next && NEXT_PRIVATE_LOCAL_WEBPACK=true next dev",
-> Error: Cannot find module /node_modules/next/dist/compiled/lib/util/makeSerializable

Install webpack. Not sure if next 12 allows the override var or not.

Thank you reply :)
I installed "webpack": "^5.91.0" in my project.
after, retry but same error 😭

HANYUNSEONG · 2024-05-03T06:12:09Z

Same error 😢

next v12.2.4

@module-federation/nextjs-mf: 8.3.12

mac os

add NEXT_PRIVATE_LOCAL_WEBPACK=true line in .env.local
"dev": "rm -rf .next && NEXT_PRIVATE_LOCAL_WEBPACK=true next dev",
-> Error: Cannot find module /node_modules/next/dist/compiled/lib/util/makeSerializable

Install webpack. Not sure if next 12 allows the override var or not.

Thank you reply :) I installed "webpack": "^5.91.0" in my project. after, retry but same error 😭

Resolved after version upgrade
nextjs 12.2.4 -> 13.5.6

imarceloi · 2024-05-28T19:16:17Z

⚠ external "shop@http://localhost:3001/_next/static/chunks/remoteEntry.js" The generated code contains 'async/await' because this module is using "external script". However, your target environment does not appear to support 'async/await'. As a result, the code may not run as expected or may cause runtime errors.

Import trace for requested module: external "shop@http://localhost:3001/_next/static/chunks/remoteEntry.js" remote shop/test

I'm receiving this same error here. Does someone knows how to fix this issue?

haroldSanchezb · 2024-07-17T19:56:32Z

Hi, I have expressjs with ts, webpack only for build bundles, and another project with commonjs and webpack i have this:

commonjs repo

const { UniversalFederationPlugin } = require('@module-federation/node');
[
    new UniversalFederationPlugin({
      name: 'remotelib',
      library: { type: 'commonjs-module' },
      isServer: true,
      remotes: {},
      filename: 'remoteEntry.js',
      useRuntimePlugin: true,
      exposes: {
        './calc': './src/util/calc',
      },
    }),
  ]

I use npx http-server for make available remoteEntry files

In my expressjs project:
init file

import { init } from '@module-federation/runtime';
init({
  name: 'app-main',
  remotes: [
    {
      name: 'remote-lib',
      entry: 'http://localhost:8080/remoteEntry.js',
      alias: 'remotelib',
    },
  ],
});

in mi app route:

import { loadRemote } from '@module-federation/runtime';
appRouter.get('/remote', async (req, res) => {
  console.log('remote');

  try {
    const remote = await loadRemote('remotelib/calc');
    const result = (remote as any).calc(1, 2);

    res.send(result);
  } catch (error: any) {
    console.error(error);
    res.send('Error');
  }
});

I don't know why im getting this error:

Error: Script execution error: Error: Cannot find module '/node_modules/@module-federation/sdk/dist/dist/index.cjs.js'
    at handleScriptFetch (/node_modules/@module-federation/sdk/dist/index.cjs.js:655:16)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)

mdadil09 · 2024-09-17T14:22:41Z

"@module-federation/nextjs-mf": "^8.2.0",
"next": "14.2.11",
"react": "^18",
"react-dom": "^18",
"webpack": "^5.94.0"

this is my next.config.js for app1
`const NextFederationPlugin = require("@module-federation/nextjs-mf");

module.exports = {
webpack(config, options) {
const { webpack } = options;
config.experiments = { topLevelAwait: true };

if (!options.isServer) {
  config.plugins.push(
    new NextFederationPlugin({
      name: "app1",
      remotes: {
        app2: app2@http://localhost:3001/_next/static/chunks/remoteEntry.js,
      },
      filename: "static/chunks/remoteEntry.js",
      exposes: {
        "./footer": "./components/Footer.js",
        "./nav": "./components/Nav.js",
      },
      shared: {},
      extraOptions: {},
    })
  );
}

return config;

},
};`

this is my next.config.js for app2

`const NextFederationPlugin = require("@module-federation/nextjs-mf");

module.exports = {
webpack(config, options) {
const { webpack } = options;
if (!options.isServer) {
config.plugins.push(
new NextFederationPlugin({
name: "app2",
remotes: {
app1: app1@http://localhost:3000/_next/static/chunks/remoteEntry.js,
},
filename: "static/chunks/remoteEntry.js",
exposes: {
"./catalog": "./components/Catalog.js",
},
shared: {},
extraOptions: {
exposePages: true,
},
})
);
}
config.cache = false;

return config;

},
};
`

this is where i am importing my remote component

`const NextFederationPlugin = require("@module-federation/nextjs-mf");

module.exports = {
webpack(config, options) {
const { webpack } = options;
if (!options.isServer) {
config.plugins.push(
new NextFederationPlugin({
name: "app2",
remotes: {
app1: app1@http://localhost:3000/_next/static/chunks/remoteEntry.js,
},
filename: "static/chunks/remoteEntry.js",
exposes: {
"./catalog": "./components/Catalog.js",
},
shared: {},
extraOptions: {
exposePages: true,
},
})
);
}
config.cache = false;

return config;

},
};
`

this is my package.json

{ "name": "app2", "version": "0.1.0", "private": true, "scripts": { "dev": "set NEXT_PRIVATE_LOCAL_WEBPACK=true && next dev -p 3001", "build": "set next telemetry disable && NEXT_PRIVATE_LOCAL_WEBPACK=true next build", "start": "set next start -p 3001", "lint": "next lint" }, "dependencies": { "@module-federation/nextjs-mf": "^8.2.0", "next": "14.2.11", "react": "^18", "react-dom": "^18", "webpack": "^5.94.0" }, "devDependencies": { "eslint": "^8", "eslint-config-next": "14.2.11", "postcss": "^8", "tailwindcss": "^3.4.1" } }

Please provide some fixes.

minr2kb · 2024-10-25T07:13:06Z

For those struggling with the Error: `Error: Cannot find module '<proj_dir>/node_modules/next/dist/compiled/lib/util/whatever'`

next v14
@module-federation/nextjs-mf: 8.6.2
mac os

The key point, as mentioned in the README, is that the plugin should make Next.js use a webpack version installed via our package manager instead of Next.js’s built-in webpack. However, if you look inside the 'require stack' of the error message, you’ll see that it’s looking for webpack modules, but /node_modules/next/dist/... references a path within Next.js itself. This suggests that the webpack reference from the plugin is incorrect!

If you check Next.js’s built-in /node_modules/next/dist/compiled/webpack/webpack.js, you’ll notice that NEXT_PRIVATE_LOCAL_WEBPACK controls the webpack reference. This is why setting NEXT_PRIVATE_LOCAL_WEBPACK=true is essential. Next.js initializes its internal webpack while the server is starting, and it only reads the .env file later. So, setting it in .env alone won’t work. You need to define NEXT_PRIVATE_LOCAL_WEBPACK=true directly in package.json to ensure it’s set before webpack initializes.

tl;dr

Error: Cannot find module '<proj_dir>/node_modules/next/dist/compiled/lib/util/whatever' is due to an incorrect webpack reference.
✅ "dev": "NEXT_PRIVATE_LOCAL_WEBPACK=true next dev"
❌ "dev": "NEXT_PRIVATE_LOCAL_WEBPACK=true && next dev"
❌ setting NEXT_PRIVATE_LOCAL_WEBPACK=true in .env

Etc.

If you’re still getting the same error even after modifying the script, the solution might be similar, but I’m not sure beyond this!
As for other module not found errors, I’m not really sure 🥲

ScriptedAlchemy · 2024-10-25T07:39:08Z

"@module-federation/nextjs-mf": "^8.2.0",
"next": "14.2.11",
"react": "^18",
"react-dom": "^18",
"webpack": "^5.94.0"

this is my next.config.js for app1
`const NextFederationPlugin = require("@module-federation/nextjs-mf");

module.exports = {
webpack(config, options) {
const { webpack } = options;
config.experiments = { topLevelAwait: true };
if (!options.isServer) {
  config.plugins.push(
    new NextFederationPlugin({
      name: "app1",
      remotes: {
        app2: app2@http://localhost:3001/_next/static/chunks/remoteEntry.js,
      },
      filename: "static/chunks/remoteEntry.js",
      exposes: {
        "./footer": "./components/Footer.js",
        "./nav": "./components/Nav.js",
      },
      shared: {},
      extraOptions: {},
    })
  );
}

return config;
},
};`

this is my next.config.js for app2

`const NextFederationPlugin = require("@module-federation/nextjs-mf");

module.exports = {
webpack(config, options) {
const { webpack } = options;
if (!options.isServer) {
config.plugins.push(
new NextFederationPlugin({
name: "app2",
remotes: {
app1: app1@http://localhost:3000/_next/static/chunks/remoteEntry.js,
},
filename: "static/chunks/remoteEntry.js",
exposes: {
"./catalog": "./components/Catalog.js",
},
shared: {},
extraOptions: {
exposePages: true,
},
})
);
}
config.cache = false;
return config;
},
};
`

this is where i am importing my remote component

`const NextFederationPlugin = require("@module-federation/nextjs-mf");

module.exports = {
webpack(config, options) {
const { webpack } = options;
if (!options.isServer) {
config.plugins.push(
new NextFederationPlugin({
name: "app2",
remotes: {
app1: app1@http://localhost:3000/_next/static/chunks/remoteEntry.js,
},
filename: "static/chunks/remoteEntry.js",
exposes: {
"./catalog": "./components/Catalog.js",
},
shared: {},
extraOptions: {
exposePages: true,
},
})
);
}
config.cache = false;
return config;
},
};
`

this is my package.json

{ "name": "app2", "version": "0.1.0", "private": true, "scripts": { "dev": "set NEXT_PRIVATE_LOCAL_WEBPACK=true && next dev -p 3001", "build": "set next telemetry disable && NEXT_PRIVATE_LOCAL_WEBPACK=true next build", "start": "set next start -p 3001", "lint": "next lint" }, "dependencies": { "@module-federation/nextjs-mf": "^8.2.0", "next": "14.2.11", "react": "^18", "react-dom": "^18", "webpack": "^5.94.0" }, "devDependencies": { "eslint": "^8", "eslint-config-next": "14.2.11", "postcss": "^8", "tailwindcss": "^3.4.1" } }

Please provide some fixes.

You didn't apply plugin to server. But your import isn't wrapped in typeof window check. So server try to import the module you don't provide a remote for.

ScriptedAlchemy · 2024-11-02T21:26:36Z

Support for next is ending

#3153

jonthomp mentioned this issue Jan 19, 2024

fix: normalize bundler runtime import paths #1997

Merged

6 tasks

zhoushaw assigned ScriptedAlchemy Jan 30, 2024

zhoushaw added the nextjs-mf nextjs-mf package identifier label Jan 30, 2024

tryptamine25 mentioned this issue May 4, 2024

nextjs mf does not generate remoteEntry.js module-federation/module-federation-examples#3845

Closed

module-federation locked and limited conversation to collaborators Nov 4, 2024

ScriptedAlchemy closed this as completed Nov 4, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

@module-federation/[email protected] module not found error #1961

@module-federation/[email protected] module not found error #1961

Capricair commented Jan 15, 2024 •

edited

Loading

gryp17 commented Jan 15, 2024

yunusileri commented Jan 18, 2024

richardklotz commented Jan 18, 2024

ScriptedAlchemy commented Jan 20, 2024

senuravihanjayadeva commented Jan 22, 2024

armedi commented Jan 26, 2024

Icammarano commented Feb 6, 2024

fgh151 commented Feb 7, 2024

renan-britz-mgm commented Feb 11, 2024 •

edited

Loading

carlosfvp commented Feb 15, 2024

mtls-david-devargas commented Feb 15, 2024

jynzo94 commented Feb 15, 2024

ScriptedAlchemy commented Mar 7, 2024

newmercer commented Mar 11, 2024

semonec commented Mar 13, 2024

semonec commented Mar 13, 2024

ScriptedAlchemy commented Mar 18, 2024

ScriptedAlchemy commented Mar 18, 2024

prakashmallow commented Apr 12, 2024

Rajashekhar-Reddy commented Apr 27, 2024 •

edited

Loading

shinyuna commented Apr 28, 2024 •

edited

Loading

prakashmallow commented Apr 29, 2024

sreeharinm commented Apr 29, 2024

HANYUNSEONG commented May 2, 2024

ScriptedAlchemy commented May 2, 2024

ScriptedAlchemy commented May 2, 2024

HANYUNSEONG commented May 2, 2024 •

edited

Loading

HANYUNSEONG commented May 3, 2024

imarceloi commented May 28, 2024

haroldSanchezb commented Jul 17, 2024

mdadil09 commented Sep 17, 2024

minr2kb commented Oct 25, 2024

ScriptedAlchemy commented Oct 25, 2024

ScriptedAlchemy commented Nov 2, 2024

@module-federation/[email protected] module not found error #1961

@module-federation/[email protected] module not found error #1961

Comments

Capricair commented Jan 15, 2024 • edited Loading

Describe the bug

Reproduction

Used Package Manager

System Info

Validations

gryp17 commented Jan 15, 2024

yunusileri commented Jan 18, 2024

richardklotz commented Jan 18, 2024

ScriptedAlchemy commented Jan 20, 2024

senuravihanjayadeva commented Jan 22, 2024

armedi commented Jan 26, 2024

Icammarano commented Feb 6, 2024

fgh151 commented Feb 7, 2024

renan-britz-mgm commented Feb 11, 2024 • edited Loading

carlosfvp commented Feb 15, 2024

mtls-david-devargas commented Feb 15, 2024

jynzo94 commented Feb 15, 2024

ScriptedAlchemy commented Mar 7, 2024

newmercer commented Mar 11, 2024

semonec commented Mar 13, 2024

semonec commented Mar 13, 2024

ScriptedAlchemy commented Mar 18, 2024

ScriptedAlchemy commented Mar 18, 2024

prakashmallow commented Apr 12, 2024

Rajashekhar-Reddy commented Apr 27, 2024 • edited Loading

shinyuna commented Apr 28, 2024 • edited Loading

prakashmallow commented Apr 29, 2024

sreeharinm commented Apr 29, 2024

HANYUNSEONG commented May 2, 2024

ScriptedAlchemy commented May 2, 2024

ScriptedAlchemy commented May 2, 2024

HANYUNSEONG commented May 2, 2024 • edited Loading

HANYUNSEONG commented May 3, 2024

imarceloi commented May 28, 2024

haroldSanchezb commented Jul 17, 2024

mdadil09 commented Sep 17, 2024

minr2kb commented Oct 25, 2024

For those struggling with the Error: Error: Cannot find module '<proj_dir>/node_modules/next/dist/compiled/lib/util/whatever'

tl;dr

Etc.

ScriptedAlchemy commented Oct 25, 2024

ScriptedAlchemy commented Nov 2, 2024

Capricair commented Jan 15, 2024 •

edited

Loading

renan-britz-mgm commented Feb 11, 2024 •

edited

Loading

Rajashekhar-Reddy commented Apr 27, 2024 •

edited

Loading

shinyuna commented Apr 28, 2024 •

edited

Loading

HANYUNSEONG commented May 2, 2024 •

edited

Loading

For those struggling with the Error: `Error: Cannot find module '<proj_dir>/node_modules/next/dist/compiled/lib/util/whatever'`