无法让 MiradorImageTools 插件工作

Question

我正在尝试让 MiradorImageTools 插件与 mirador 图片查看器一起使用。

我正在使用非常基本的 html 页面进行测试：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Mirador-Test</title>
</head>

<body>
  <h1>Title</h1>
  <div>
    <p>blah</p>
    <div id="my-mirador" />

    <script src="https://unpkg.com/mirador@latest/dist/mirador.min.js"></script>
    <script src="https://unpkg.com/mirador-image-tools@0.10.0/umd/mirador-image-tools.min.js"></script>

    <script type="text/javascript">
      const config = {
        "id": "my-mirador",
        "manifests": {
          "https://iiif.lib.harvard.edu/manifests/drs:48309543": {
            "provider": "Harvard University"
          }
        },
        "windows": [
          {
            "imageToolsEnabled": "true",
            "manifestId": "https://iiif.lib.harvard.edu/manifests/drs:48309543",
          }
        ]
      };

      // var mirador = Mirador.viewer(config);
      var mirador = Mirador.viewer(config, [MiradorImageTools]);  // <-- Error!

    </script>
  </div>
</body>

</html>

这给了我以下错误：

Uncaught ReferenceError: MiradorImageTools is not defined
    <anonymous> ./test3.html:36
test3.html:36:45

如果我将插件排除在外，将有问题的行替换为上面注释掉的行，整个过程就可以正常工作，并且我可以正常显示 mirador。

很明显我引用的插件是错误的。但正确的做法是什么？

Answer 1

要使用 MiradorImageTools 和任何其他 Mirador 插件（自 v3.0.0 起），您需要导入包并使用 Webpack or parcel.[=13= 等工具创建项目构建]

可以在此处查看此类设置的示例：https://github.com/projectmirador/mirador-integration 其中包括同时使用 Webpack 和 parcel 的示例。

./src/index.js
import Mirador from 'mirador/dist/es/src/index';
import { miradorImageToolsPlugin } from 'mirador-image-tools';

const config = {
  id: 'demo',
  windows: [{
    imageToolsEnabled: true,
    imageToolsOpen: true,
    manifestId: 'https://purl.stanford.edu/sn904cj3429/iiif/manifest',
  }],
  theme: {
    palette: {
      primary: {
        main: '#1967d2',
      },
    },
  },
};

Mirador.viewer(config, [
  ...miradorImageToolsPlugin,
]);

有关如何为特定工具构建的更多信息，请参阅那里的自述文件。

无法让 MiradorImageTools 插件工作

Can't get MiradorImageTools Plugin to work

html

javascript

plugins

iiif