小编Pra*_*tti的帖子

如何在 React 微前端中使用多个模块之间的公共依赖关系

嘿,我在我的 React 项目中使用 React 微前端和 webpack 模块联合。根据微前端结构更改文件夹结构后,处理模块的常见依赖关系面临一些困难。

出现以下错误:

    ERROR in resolving fallback for shared module react
    Module not found: Error: Can't resolve 'react' in '/Users/admin/Desktop/guru/project/microfrontend/modules/metronic/layout/components/subheader/components'
    ERROR in resolving fallback for shared module react
Module not found: Error: Can't resolve 'react-router-dom' in '/Users/admin/Desktop/guru/project/microfrontend/modules/metronic/layout/components/subheader/components'
Run Code Online (Sandbox Code Playgroud)

这里我分享一下我的代码结构

  1. 网络包
  2. 包.json
  3. 文件夹结构

网页包:

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
require('dotenv').config({ path: '../.env' });

module.exports = {
  // the output bundle won't be optimized for production but …
Run Code Online (Sandbox Code Playgroud)

reactjs react-dom micro-frontend webpack-5 webpack-module-federation

5
推荐指数
0
解决办法
1690
查看次数