Vite-Plugin-Federation can't import react components with hooks

Question

I want to use vite federation to build a micro-frontend structure. However, host website will get error when the remote components have hooks. Would like to ask if there is any problem in my setting?

Used plugin: @originjs/vite-plugin-federation: v1.1.9

error message:

https://i.stack.imgur.com/GVsmM.png

Host

vite.config.js

export default defineConfig(({ mode }) => {
  plugins: [
      react(),
      federation({
        name: 'host',
        filename: 'remoteEntry.js',
        remotes: {
          imbee_workflow: 'http://localhost:5001/assets/remoteEntry.js',
        },
        shared: ['react', 'react-dom'],
      }),
    ],
    build: {
      outDir: path.join(__dirname, 'build'),
      target: 'esnext',
      minify: false,
      cssCodeSplit: false,
    },
}

code

import { Box } from '@mui/material';
import React from 'react';

const Button = React.lazy(() => import('remote/Button'));

function hostPage() {
  return (
    <Box height="100%" width="100%" overflow="hidden">
      <Button caption="Hello World" />
    </Box>
  );
}

export default hostPage;

Remote

vite.config.js

export default defineConfig({
  plugins: [
    react(),
    federation({
      name: 'remote',
      filename: 'remoteEntry.js',
      exposes: {
        './Button': './src/Button.tsx',
        './Hello': './src/Hello.tsx',
      },
      shared: ['react', 'react-dom'],
    }),
  ],
  build: {
    target: 'esnext',
    minify: false,
    cssCodeSplit: false,
  },
});

code

import React from 'react';

function Button({ caption = 'Home Button' }) {
  // Without hooks, there won't have any problem.
  const [test, setTest] = React.useState('test');
  return <button>{`${caption}-${test}`}</button>;
}

export default Button;

Answer 1

I changed a version Node to 18.16.0 and it works for me. For a version 16.13 I get errors when use hooks in remote component

Answer 2

in 1.1.11 it bug fixed for simple hooks, try:

npm install @originjs/vite-plugin-federation@1.1.11 --save-dev