qiankun 乾坤主应用访问微应用css静态图片资源报404

发现static前没有加我指定的前缀

qiankun 乾坤主应用访问微应用css静态图片资源报404_第1张图片只有加了后才会出来

解决方案:

env定义前缀

.env.development文件中

# static前缀
VUE_APP_PUBLIC_PREFIX=""

.env.production文件中

# static前缀
VUE_APP_PUBLIC_PREFIX="/szgl"

settings文件是封了一下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;

}

你可能感兴趣的:(vue.js,前端,javascript)