微前端实践踩坑记录

最新推荐文章于 2023-08-18 15:32:45 发布

lzjscj

最新推荐文章于 2023-08-18 15:32:45 发布

阅读量421

点赞数

分类专栏：微前端文章标签：前端 webpack javascript react

本文链接：https://blog.csdn.net/lieinthebed/article/details/126691615

版权

本文记录了使用qiankun部署微前端过程中遇到的挑战。在遵循官方教程并尝试集成rescripts插件时，遇到了webpack配置错误。通过逐步排查，最终发现只需注释掉特定的两条webpack配置，就能成功避免错误并实现正常运行。

摘要由CSDN通过智能技术生成

qiankun部署微前端

教程： https://qiankun.umijs.org/zh/guide/tutorial
部署信息：主应用： react项目, 微应用react项目
bug：跟着教程一步步来都没啥问题，直到下载rescripts插件，并重新更改webpack配置时保了错，如下：

// 教程配置
const { name } = require('./package');

module.exports = {
    webpack: (config) => {
        config.output.library = `${name}-[name]`;
        config.output.libraryTarget = 'umd';
        config.output.jsonpFunction = `webpackJsonp_${name}`;
        config.output.globalObject = 'window';
        return config;
    },

    devServer: (_) => {
        const config = _;

        config.headers = {
            'Access-Control-Allow-Origin': '*',
        };
        config.historyApiFallback = true;
        config.watchContentBase = false;
        config.liveReload = false;

        return config;
    },
};