javascript - Webpack 5 使用 html-loader 加载 svgs

Question

我最近升级到 Webpack 5，我的 html-loader 不再加载 svg 文件并内联它们。

这是我在 webpack 中的 svg 规则

{
  test: /\.svg$/,
  use: [
    {
       loader: 'html-loader',
       options: {
           minimize: true,
       },
    },
  ],
},

无论我如何尝试导入它，它似乎只是创建一个文件而不给我一串 HTML。

import mySvg from "../path/to/my.svg"

let mySvg = require("../path/to/my.svg").default;

// output = "/build/path/my.svg"
// output I want = "<svg>...."

它过去没有给我几个构建文件，而是将它们内联在我的 JS 中。

帮助将不胜感激。

Answer 1

svg-inline-loader可以实现相同的（确认工作）。

我在https://survivejs.com/webpack/loading/images/#loading-svgs列出了加载 SVG 的其他选项。