lishaobos / vite-plugin-legacy-qiankun

让 vite 集成 qiankun,支持 js,css 沙箱
106 stars 10 forks source link

fix: support base is ./ #4

Closed glennliao closed 1 year ago

glennliao commented 1 year ago

当base设置为./的时候,

export default {
  base: base ? `./` : '/',
  build: {
    outDir: '../dist/vue3'
  },
 ...
}

打包出来之后 System.import 路径如下

image

导致实际加载的路径变成了主引应用的

image

调整之后给路径加上 publicPath, 可以正常加载子应用

image

lishaobos commented 1 year ago

十分感谢贡献!!!

我说说我的想法:

我在开发环境换成 ./ ,没有发生啥问题。

如果在生产环境,相对路径是会有其他问题的,我们顶多处理了 html 里面所有连接的正确路径,但是项目中还有很多资源,比如图片,css 的打包,如果 base 不是固定路径,比如:http://xx.com,而是 / 或者 ./ 这种的,被主应用引用的时候还是会发生路径问题。

不确定我又没有表达清楚。😄😄😄

glennliao commented 1 year ago

@lishaobos 我的使用场景中需要 ./ , 不能是固定路径。 css和script标签中的src其实是正常加载的,就是System.import 无法加载

图片或其它静态资源的话, 目前肯定是需要子应用处理下的(例如设置的path都与publicPath拼接)。

lishaobos commented 1 year ago

@lishaobos 我的使用场景中需要 ./ , 不能是固定路径。 css和script标签中的src其实是正常加载的,就是System.import 无法加载

图片或其它静态资源的话, 目前肯定是需要子应用处理下的(例如设置的path都与publicPath拼接)。

你好,可以麻烦提供一个可复现错误的 git 仓库吗,或者具体操作步骤,我好在我这边看下是否会有其他的影响。

glennliao commented 1 year ago

就是将 vite-vue3 中的

export default {
  base: base ? `${base}9528/` : '/',
  build: {
    outDir: '../dist/vue3'
  },

改成

export default {
  base: base ? `./` : '/',
  build: {
    outDir: '../dist/vue3'
  },

然后build之后,main访问

shedan9 commented 1 year ago

请问vite.config.js里怎么判断是否是主应用?microApp.POWERED_BY_QIANKUN会报window is not defined,上面示例里的base ? ./ : '/',base指的是什么呢?