BFF and Module Federation

[42tg]

Hi,

I'm not sure if this is officially used in this way but I'm curious if its possible to share an Component wich is using an bff function via Module Federation.

After enabling BFF everything works fine as expected in my producer Application.

But on the Host it obviously fetches not the original producer Application, instead it calls simply /api/lamda/hello but I asked myself the Question if its somewhere configurable to add automatically the host adress from the Server to this kind of requests.

Am I only to naive to have this use case in mind ?

//api/lamda/hello.ts
export const get = async () => {
  console.log('Server Side Log');
  return 'Hello Modern.js';
};

//src/components/Counter.tsx
import { get as hello } from '@api/lambda/hello';
import { useEffect, useState } from 'react';

export default function Counter({ initialCount = 0 }) {
  const [count, setCount] = useState(initialCount);

  useEffect(() => {
    const fetchData = async () => {
      const data = await hello();
      console.log(data, count);
    };
    fetchData();
  }, [count]);
  return (
    <button type="button" onClick={() => setCount(count => count + 1)}>
      count is {count}
    </button>
  );
}

[zllkjc]

good idea!

Now modern.js not support it. but we can disscuss here. In bytedance, we support cross project bff, maybe its can also use here.

[42tg]

Can you maybe explain the cross project BFF a bit more in detail?

I read the docs about that but don't get the grasp for what it's used for.

Are there any examples about that too find anywhere?

[42tg]

I made it to work with configuring the Request correctly, it took a while until I found the configure hook correctly.
Since the package @modern-js/runtime/bff does not exists anymore.

with

import { configure } from '@modern-js/plugin-bff/runtime/create-request';

// ...

configure({
  setDomain() {
    return 'http://localhost:<port>';
  },
});

It worked at least locally, have to tinker around how I can pass it for production build.

[zllkjc]

this feauture also work！nice, I've overlooked this solution.

[zllkjc]

maybe you can use globalVars in production build. if you knows it on build time.

[zllkjc]

@keepview Maybe we can check if there is a more automated way!