如何“需要”一个 xml 文件（由 webpack 加载）以便在 javascript 中读取 xml 内容

Question

我使用 webpack 作为应用程序的捆绑程序，并使用 XML 文件进行配置。目前我正在编写测试以从 webpack 打包的 XML 文件中检索配置。

参考这篇 webpack 文章：加载数据我遇到问题的代码是这样的：

import Data from './data.xml';

我是我自己的测试，我使用的是require形式，如下所示：

const select = require('xpath.js');
const DOMParser = require('xmldom').DOMParser
const parser = new DOMParser();
const data = require('./app.config.xml'); // <- THIS IS MY PROBLEM
const xdocument = parser.parseFromString(data.toString(), 'text/xml');

XML 文件的“require”如何工作？

这段代码：

console.log("DATA: " + data.toString());

产生这个输出：

DATA: [object Object]

所以我不知道需要创建什么对象。

我看过很多有关将 xml 读入 JSON 的其他代码示例，但我不知道如何处理 JSON 对象。我想将 XML 作为 XMLObject 进行询问，以便可以对其运行 xpath 查询。

我可以通过运行轻松获取 JSON

JSON.stringify(data)

显示如下内容：

    {"Application":{"$":{"name":"config-data"},"Imports":[{"Import":[{"$":{"from":"./another.config.xml"}}]}],"Con

which is not what I want. So how can I get the XML content from *data* as a string, which is what **parser.parseFromString** needs?

我的测试代码如下：

  describe.only('xpath examples (zenobia)', async assert => {
    const xdoc = require('./app.config.xml');

    let applicationNodes = select(xdoc, "/Application"); // THIS RETURNS a DOMObject
    console.log(`Found ${applicationNodes.length} Application elements`);

    assert({
      given: 'an inline xml document with an Application',
      should: 'Select an element from the root',
      condition: applicationNodes !== null
    });
  });

该日志消息显示：

Found 0 Application elements

对于 XML 文档来说：

<?xml version="1.0"?>
<Application name="app">
  <Imports/>
</Application>

Answer 1

如果你想将 XML 文件作为字符串读取，你可以简单地使用 Webpack raw-loader并进行以下配置

// webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.xml$/i,
        use: 'raw-loader',
      },
    ],
  },
};

现在data在

const data = require('./app.config.xml');

应该是来自 XML 文件的原始数据（即字符串） - 代码的其余部分现在应该按预期工作