乾坤子应用中图片和elementUI图标都无法加载

方法一： vue.config.js中配置图片路径

const publicPath = process.env.NODE_ENV === 'production' ? '页面部署地址' : 'http://localhost:18091/'
module.exports = {
  publicPath: '',
  configureWebpack: {
    output: {
      library: `${name}-[name]`,
      libraryTarget: 'umd', // 把微应用打包成 umd 库格式
      jsonpFunction: `webpackJsonp_${name}`
    },
    plugins: [
      new CopyWebpackPlugin([
        {
          from: 'node_modules/@easydarwin/easyplayer/dist/component/EasyPlayer.swf',
          to: './libs/EasyPlayer/'
        },
        {
          from: 'node_modules/@easydarwin/easyplayer/dist/component/crossdomain.xml',
          to: './libs/EasyPlayer/'
        },
        {
          from: 'node_modules/@easydarwin/easyplayer/dist/component/EasyPlayer-lib.min.js',
          to: './libs/EasyPlayer/'
        }
      ])
    ]
  },
    // 添加下方配置就能解决
  chainWebpack: (config) => {
    const fontRule = config.module.rule('fonts')
    fontRule.uses.clear()
    fontRule
      .use('file-loader')
      .loader('file-loader')
      .options({
        name: 'fonts/[name].[hash:8].[ext]',
        publicPath
      })
      .end()
    const imgRule = config.module.rule('images')
    imgRule.uses.clear()
    imgRule
      .use('file-loader')
      .loader('file-loader')
      .options({
        name: 'img/[name].[hash:8].[ext]',
        publicPath
      })
      .end()
  }
}

方法二：vue.config.js中配置，遇到项目部署后内外网两个访问地址的时候可以用，第一种方式只能设置一个publicPath路径，如果有两个页面访问地址图片没办法满足

module.exports = {
  publicPath: "",
  transpileDependencies: ['vue-puzzle-verification','@xunlei/vue-context-menu'],
  devServer: {
    // host: 'localhost'
    //设置跨域
    port: "19712", // 端口号
    overlay: {
      warnings: false,
      errors: true,    
    },
    headers: {
      'Access-Control-Allow-Origin': '*',
    },
  },
  configureWebpack: (config) => {
    config.externals = {
      AMap: "AMap",
    };
  },
  // 调整乾坤子应用打包格式
  configureWebpack: {
    output: {
      library: `${name}-[name]`,
      libraryTarget: 'umd', // 把微应用打包成 umd 库格式
      jsonpFunction: `webpackJsonp_${name}`,
    },
    plugins:[
      new CopyWebpackPlugin([
        {
          from: 'node_modules/@easydarwin/easyplayer/dist/component/EasyPlayer.swf',
          to: './libs/EasyPlayer/'
        },
        {
          from: 'node_modules/@easydarwin/easyplayer/dist/component/crossdomain.xml',
          to: './libs/EasyPlayer/'
        },
        {
          from: 'node_modules/@easydarwin/easyplayer/dist/component/EasyPlayer-lib.min.js',
          to: './libs/EasyPlayer/'
        }
      ])
    ]
  },
    // 添加下方代码可以解决图片不加载问题
  chainWebpack: (config) => {
    config.module
      .rule('fonts')
      .test(/\.(ttf|woff)(\?.*)?$/)
      .use('url-loader')
      .loader('url-loader')
      .tap(options => {
            options = {
              ...options,
              limit: 99999999,
              name: 'fonts/[name].[hash:8].[ext]',
          }
          return options
      })
      .end()
    config.module
      .rule('images')
      .test(/\.(png|jpe?g|gif|svg)(\?.*)?$/)
      .use('url-loader')
      .loader('url-loader')
      .tap(options => {
            options = {
              ...options,
              limit: 99999999,
              name: 'img/[name].[hash:8].[ext]',
          }
          return options
      })
      .end()
  }
};