How to get Images from bundled app

Question

I have a bundled app with webpack with this script. This script alsa exports files as well.

I import this app from another app. The bundled app works pretty well inside the paretn app but I couldn't find how to display and use this exported images in the parent app. They aren't shown. My guess is webpack doesn't see the images as module.

module.exports = {
  devtool: 'source-map',
  entry: './src/App.js',
  
  output: {
    path: path.join(__dirname, 'build'),
    filename: 'bundle.js',
    libraryTarget: 'commonjs2'
  },

  plugins: commonConfig.plugins.concat([
    new webpack.optimize.OccurrenceOrderPlugin()
  ]),

  resolve: commonConfig.resolve,

  module: {
    rules: commonConfig.module.rules.concat({
      test: /\.less$/,
      use: [
        'style-loader',
        'css-loader?modules&importLoaders=1&localIdentName=[path]___[name]__[local]___[hash:base64:5]!postcss-loader',
        'less-loader'
      ]
    })
  },

  externals: {
    'react': 'commonjs react'
  }
};

Answer 1

The solution I found for now is include images (small svg and png files) to bundle with this kind of configs. it may be a better solution with code splitting.

  {
    test: /.*\.(svg)$/i,
    include: path.resolve(mainPath, 'ui/svg/inline'),
    use: "svg-inline-loader"
  },
  {
    test: /.*\.(svg)$/i,
    include: path.resolve(mainPath, 'ui/svg/default'),
    use: {
      loader: "url-loader",
      options: {
        limit: 100000
      }
    }
  },