Example `Non-UI Module` mentioned in readme file is missing

[bahadirh]

I couldn't find the Non-UI Module example in this repo. it's mentioned in the top-level readme.md file. i don't know if it's part of another example. where can i find the code of this example?

[ScriptedAlchemy]

I think this must be an old example. What are you looking for in the example?

if you want non UI module, it should work the same, just import the utility and use it without react lazy etc?

[bahadirh]

what i'd like to achieve is that on top of react/nextjs components, we have hooks, API handlers, basic general-use functions etc. in our projects to share with module federation. the closest concept i could find to do that was sharing non-UI modules.

in the react-nextjs/nextjs-host-remote example, i created a function that just console.logs a text and added it to NextFederationPlugin config in react-nextjs/nextjs-host-remote/remote/next.config.js. here's the plugin config after this change:

new NextFederationPlugin({
    name: 'remote',
    exposes: {
        './nextjs-remote-component': './components/nextjs-remote-component.js',
        './basic-function': './helpers/basic-function.js',  // only this line is added, the rest is from the example
    },
    shared: {},
    filename: 'static/chunks/remoteEntry.js',
})

Here's the example function i wanted to share with module federation, defined in newly-created react-nextjs/nextjs-host-remote/remote/helpers/basic-function.js file:

export default () => console.log('console log from federated function')

below is how i tried to use it in the host project next to remote in the same example, inside react-nextjs/nextjs-host-remote/host/pages/index.js:

import Head from 'next/head';
import Image from 'next/image';
import styles from '../styles/Home.module.css';
import dynamic from 'next/dynamic';

// import basicFunction from 'remote/basic-function';
const basicFunction = import('remote/basic-function'); // tried the `import` above too, got the same error in the screenshot below

const NextjsRemoteComponent = dynamic(() => import('remote/nextjs-remote-component'), {
  ssr: false,
});

export default function Home() {
  basicFunction();

  return <></>;
}

i deleted most of the html in the return statement, since it's not required in the setup i want to achieve.

here's the screenshot of the error i get in the host app when i visit the page:

i don't know what's missing in this configuration. i didn't touch rest of the files, only auto-generated package-lock.json files.

how can i achieve sharing a non-UI module in this configuration?

[ScriptedAlchemy]

Dont use next/dynamic, use react lazy