Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🐜 ant design pro 接入qiankun,怎么解决静态资源404问题? #10064

Closed
DemoPan opened this issue Jul 26, 2022 · 2 comments
Closed

Comments

@DemoPan
Copy link

DemoPan commented Jul 26, 2022

🧐 问题描述 | Problem description

ant design pro 作为子应用如果接入qiankun,静态资源的404如何处理?有没有实际可以跑起来的demo?
主应用端口8001,子应用端口7001

目前做过的尝试:

方法一:
config.ts中配置publicPath: '//localhost:7001/'

方法二:
src目录下新建public-path.js,在app.ts中引入,log能看到__webpack_public_path__被赋值 http://localhost:7001/

💻 示例代码 | Sample code

🍭 子应用配置

// config.ts

export default defineConfig({
  hash: true,
  antd: {},
  // 省略其它 and design pro 默认配置代码
  qiankun: {
    slave: {},
  },
});
// src/app.tsx
import './public-path';
import type { Settings as LayoutSettings } from '@ant-design/pro-layout';
import { SettingDrawer } from '@ant-design/pro-layout';

// 这里省略 ant design pro 默认配置代码

export const qiankun = {
  async bootstrap(props: any) {
    console.log('Antd5 bootstrap', props);
    if (props) {
      isMenu = props.isMenu;
    }
  },
  async mount(props: any) {
    console.log('Antd5 mount', props);
  },
  async unmount(props: any) {
    console.log('Antd5 unmount', props);
  },
};
// src/public-path.js

if (window.__POWERED_BY_QIANKUN__) {
  __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
  console.log(__webpack_public_path__); // http://localhost:7001/
}

🚑 其他信息 | Other information

如图在主应用中加载子应用,子应用中图片没有按照期望从相对路径变成绝对路径。

image

OS:
macOS 12.4 (21F79)

Node:
v16.16.0

浏览器 | browser:
103.0.5060.134(正式版本) (x86_64)

@DemoPan DemoPan closed this as completed Jul 26, 2022
@DemoPan
Copy link
Author

DemoPan commented Jul 26, 2022

只有放在public的静态资源会有这个问题,感觉和之前想法不是很符合,就关了。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant