node.js - 在 react-redux MERN 应用程序中导入 SVG 时出错

Question

我需要将 .svg 文件加载到 MERN 样板项目中的反应组件中。我用 webpack.config.dev.js 中的这个条目配置了 webpack url- loader：

{
 test: /\.jpe?g$|\.gif$|\.png$|\.svg$|\.otf$|\.ttf$/i,
 loader: 'url-loader?limit=10000',
}

我尝试通过以下方式访问组件中的资源：

import logo from '../../../../assets/logo_h.svg'

但是我在启动npm start 时遇到了这个错误

SyntaxError: : Unexpected token (1:1)
> 1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
    |  ^

Answer 1

您必须删除<?xml ...SVG 顶部的 。它不需要渲染 SVG，并且在尝试解析时经常在 webpack 中抛出错误。