关于javascript：通过Webpack在TypeScript React应用中导入SVG

Import SVG in TypeScript React app with Webpack

我想将SVG图像导入一个用TypeScript编写并与Webpack捆绑在一起的React应用程序中。问题是没有显示图像(只有浏览器的后备图像没有找到图像)。数据URL似乎是错误的，因为当我在base64解码器中复制数据URL时，图像已损坏。

我尝试了不同的Webpack加载器(URL加载器，文件加载器，svg加载器...)

webpack.config.json

1
2
3
4
5
6
7
8

module: {
rules: [
{
test: /\\.svg$/,
loader: 'url-loader'
}
]
}

tsd.d.ts

1
2
3
4

declare module"*.svg" {
const content:string;
export default content;
}

App.tsx

1
2
3
4
5
6
7
8
9

import content from './logo.svg';

class App extends React.Component {
render() {

<img src={content} />

}
}

有什么想法要改变吗？

提前致谢！