qiankun Qiankun メイン アプリケーションがマイクロアプリケーションの CSS 静的画像リソースにアクセスすると 404 を報告する

static の前に指定したプレフィックスが付いていなかったことがわかりました。

追加して初めて出てきます

解決：

環境定義プレフィックス

.env.development ファイル

# static前缀
VUE_APP_PUBLIC_PREFIX=""

.env.production ファイル

# static前缀
VUE_APP_PUBLIC_PREFIX="/szgl"

設定ファイルは src\settings.js に封印されています

module.exports = {

  /**
   * public文件前缀
   */
  publicPrefix: process.env.VUE_APP_PUBLIC_PREFIX

}

ページ書き込み

import settings from '@/settings'
  data () {
    return {
      cameraBackground: `url(${settings.publicPrefix}/assets/img/camera.png)`,
      cameraHover: `url(${settings.publicPrefix}/assets/img/camera-hover.png)`,
}}

.camera {
  position: absolute;
  width: 80px;
  height: 80px;
  cursor: pointer;
  // background-image: url('@/assets/img/camera.png');
  background-image: v-bind(cameraBackground);
  background-size: cover;

}