显示带有语义UI反应的svg？

Question

如何显示带有语义用户界面反应图像组件的图像？ 我注意到非反应版本说它支持svg和img但反应版本没有说明是否支持。 我在做什么

<Image src={ImagePath}/>

但是，我只是看到一个损坏的图像图标。 Webpack可以正确编译它，因此路径没有错误。 有人可以让我知道解决我问题的最佳方法是什么？

Answer 1

我正在使用webpack4，以下是我用于图像的设置，

webpack.config.js，模块规则-

{
    test: /\.(ttf|woff|woff2|eot|png|svg|gif)$/,
    use: {
    loader: 'url-loader',
    options: {
            limit: 10000
        }
    }
}

我在src/中有一个static/目录，其中包含图像，并使用CopyWebpackPlugin ，将所有这些图像复制到build/中，

webpack.config.js，模块插件-

new CopyWebpackPlugin([ { from: 'src/static' } ]),

最后，为了在语义UI反应的Image组件中使用svg ，我通过相对路径将其称为-

<Image src="/images/logo.svg" alt="no logo"/>

希望这可以帮助。