如何使用语义-ui-react图像组件显示图像?
我注意到非反应版本说它支持svg和img
,但反应版本没有说明它是否存在。
我正在做的是
<Image src={ImagePath}/>
但是,我只是看到一个破损的图像图标。 Webpack正确编译它,所以路径没有错。 有人能让我知道我的问题的最佳解决方案是什么?
答案 0 :(得分:0)
我正在使用webpack4,以下是我用于图像的设置,
webpack.config.js,模块规则-
{
test: /\.(ttf|woff|woff2|eot|png|svg|gif)$/,
use: {
loader: 'url-loader',
options: {
limit: 10000
}
}
}
我在 static/
内有一个 src/
目录,其中包含图像,并使用 CopyWebpackPlugin
,将所有这些图像复制为 build/
,
webpack.config.js,模块插件-
new CopyWebpackPlugin([ { from: 'src/static' } ]),
最后要在语义UI反应的Image组件中使用 svg ,我通过相对路径将其称为-
<Image src="/images/logo.svg" alt="no logo"/>
希望这会有所帮助。