在 Nuxt 应用程序中加载 .mov 格式的视频（适用于 Safari）答案

【问题标题】：Loading a .mov format video in a Nuxt app (for Safari)在 Nuxt 应用程序中加载 .mov 格式的视频（适用于 Safari）
【发布时间】：2021-12-12 19:21:18
【问题描述】：

在我的 Nuxt 应用程序中，我正在加载 .webm 格式的视频，该视频按预期工作。作为 Safari 的后备，我想加载一个.mov 格式的视频：

<video>
  <!-- Safari -->
  <source src="~/assets/videos/video.mov" type="video/mov" />
  <!-- other browsers -->
  <source src="~/assets/videos/video.webm" type="video/webm" />
</video>

但是，默认的 webpack 配置似乎不支持这种格式，这是我得到的：

模块解析失败：意外字符 '' (1:0) 您可能需要适当的加载程序来处理此文件类型，目前没有配置加载程序来处理此文件。见https://webpack.js.org/concepts#loaders（此二进制文件源代码省略）

问题是如何配置这种特定文件类型 (mov) 的加载器？
我在提到的链接中找不到任何有用的东西，在一般的网络上也找不到。

请查看CodeSandbox 以查看此问题的重现。

我们将不胜感激。

【问题讨论】：

你有没有看过如何为 Webpack 提供一个特定的加载器？这里和那里都有一些教程。
您解决问题了吗？如果你确实让我知道如何，请。
@Eduardo，我最终使用了带有 .mp4 扩展名的 mov 格式的视频似乎可以工作????。
如果您不介意，请为这个问题投票，所以它应该得到一些关注。
在这里被点赞，现在不会给你更多的知名度。同时，您可以研究如何加载特定的加载器并将其写在此处，可能会对下一个人有所帮助。

标签： vue.js webpack safari nuxt.js .mov

【解决方案1】：

遇到了同样的问题。我们所需要的只是扩展webpack 的配置。这就是我的nuxt.config.js 的build 部分的样子：

build: {
  extend (config) {
    config.module.rules.push({
      test: /\.(mov)$/i,
      loader: 'file-loader',
      options: {
        name: '[path][name].[ext]',
        esModule: false
      }
    })
  }   
}

【讨论】：

谢谢！似乎是正确的解决方案。
不客气！）希望有人会觉得这很有用:)