Question

我有一个带有此脚本的webpack的捆绑应用程序。此脚本alsa也会导出文件。

我从其他应用导入此应用。捆绑的应用程序在paretn应用程序中运行良好，但我找不到如何在父应用程序中显示和使用此导出的图像。他们没有显示。我的猜测是webpack没有将图像看作模块。

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

我现在发现的解决方案是包括将图像（小的svg和png文件）与这种配置捆绑在一起。通过代码拆分可能是更好的解决方案。

  {
    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
      }
    }
  },

如何从捆绑的应用程序中获取图像

1 个答案: