无界常见问题6：css 样式内部的相对地址相对的是主应用的域名

[cludely]

描述bug 我在无界子应用中，使用了Element Plus，并按照Element Plus官方文档的按需导入指南使用了unplugin-vue-components和unplugin-auto-import这两款插件，vite.config.js配置如下：

plugins: [
    // 自动导入Element Plus
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [ElementPlusResolver()],
    }),
  ],

配置好之后，发现css样式内部的地址失效了。 经过检查发现

1. 在没配置unplugin-vue-components插件之前，css样式内部的相对地址改成了子应用的地址，此时可以正常显示图片
2. 在配置了这个插件之后，css样式内部的相对地址相对的是主应用的域名，此时不能正常显示图片
3. 但是如果在页面中显式的导入Element Plus的组件，那么css样式内部的地址又能正常显示图片了，如下：

   import { ElMessage, ElMessageBox, ElNotification, ElButton, ElPopconfirm, ElRow, ElCol, ElDialog, ElRadio, ElDrawer, ElOption, ElSelect, ElDatePicker, ElPopover, ElTooltip } from 'element-plus'

4. 使用@element-plus/nuxt也会导致同样的问题

如何复现 给出详细的复现步骤 1、子应用中放入一张css背景图片，并使用相对路径

.test6 {
  width: 200px;
  height: 150px;
  background: url('../../assets/image/time.jpg') no-repeat center center;
  background-size: 100% 100%;
}

2、子应用中使用上述的插件

npm install -D unplugin-vue-components unplugin-auto-import

vite.config.js

plugins: [
    // 自动导入Element Plus
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [ElementPlusResolver()],
    }),

    // 自动导入Element Plus
    // ElementPlus({}),
  ],

问题 虽然可以换成显式导入的方式代替，但还是想知道为什么会这样？是因为样式先经过插件的处理之后，css-loader处理不到吗？求大佬解答

错误截图 如果有可以将截图带上

最小复现仓库或者地址 重要！！！，请尽量给出复现仓库，这样能极大加快bug解决速度

[CGZ-Two-dates]

这个问题还存在啊

[CGZ-Two-dates]

官方怎么说解决了

[ArronYR]

使用vitepress 1.0生成了一个文档站点（vite 5.2.2）打包后使用nginx容器部署起来，作为子应用引入主应用，js文件加载没问题，但是css文件请求的链接变成了主应用的host

[hengyanqwe]

我也是这个问题，子应用用的是url()来设置背景图片，主应用集成后就变成用主应用的相对了，然后就不显示