是否可以将 React.JS 应用程序用作使用 NextJS 构建的容器应用程序中的微前端？

如何解决是否可以将 React.JS 应用程序用作使用 NextJS 构建的容器应用程序中的微前端？

我有一个使用 NextJS 的网页。我想在这个 NextJS 网站上添加一个位于另一个 repo 中的 vanilla React.JS 应用程序。使用微前端架构。是否有可能？我应该从哪里开始？

欢迎所有建议。

谢谢

解决方法

我认为答案是肯定的，因为 Nextjs 是建立在 Reactjs 之上的。 Nextjs 使用与 Reactjs 相同的结构。

,

有几个选项。

• 复制并粘贴其他存储库中的组件，然后在您的下一个应用中使用它们（以防您不再需要维护旧的）
• 将可重用组件放入 npm 库中，然后在您的下一个应用中安装该库，并在必要时逐个导入组件。
• 从您的旧应用创建一个构建版本，并使用动态导入将此代码导入 nextjs 代码库。见下文：

import dynamic from 'next/dynamic';

const MyOldApp = dynamic(
  () =>
    import('my-old-app/build').then(app => {
      return app
    })
)

const NewApp = () => {
  return (
    <main>
      ...
      <MyOldApp />
    </main>
  )
}