0

我一定遗漏了一些东西,因为似乎几乎没有关于在 webpack 中解析锚标签的文档。例如,如果我想散列链接到我的登录索引页面中的 html 文件的名称。

就像这篇文章说的: Webpack html-loader error processing href in anchor tags。即使我尝试在 html-loader 中扩展支持的标签,它也会导致错误。以下是有关扩展支持标签的文档:https ://webpack.js.org/loaders/html-loader/#list 。

那么anchor>href标签有什么特别之处呢?

4

1 回答 1

1

您链接的示例帖子未使用扩展 (...) 运算符,如果您只是尝试添加源而不是定义有限数量的源,这可能是问题的一部分——如果您特别想要未管理其他文件类型的错误。

从我今天创建的配置文件中,它适用于 anchor hrefs:

  module: {
    rules: [
      {
        test: /\.(jpg|svg|png|pdf|gif)$/,
        type: "asset/resource",
      },
      {
        test: /\.html$/,
        loader: "html-loader",
        options: {
          sources: {
            list: [
              // All default supported tags and attributes
              "...",
              {
                tag: "a",
                attribute: "href",
                type: "src",
              },
            ],
          },
        },
      },
    ], 
  }

如果没有上面 list: 数组中的“...”,webpack 会将其源代码替换为列出的源代码,而不是源代码添加到现有列表中。

我专门使用此配置从我的 HTML 中的锚标记中获取我的 src/ 文件夹中的 PDF 资产,将其复制到 dist/ 并href在最终构建中更新它,这对我来说是正确的。

于 2021-06-21T22:21:10.713 回答