我们如何在 React 中加载 WebVtt 文件？

Question

这是我的数据结构

WEBVTT

00:00:15.000 --> 00:00:17.951 在左边我们可以看到...

00:00:18.166 --> 00:00:20.083 在右边我们可以看到...

00:00:20.119 --> 00:00:21.962 ......头部咆哮者

我正在尝试解析一个 web vtt 文件。为此，我写道：

     var data = require('./captions.en.vtt');

错误

客户端：47 ./src/captions.en.vtt 模块解析失败：C:\Users\sampr\Desktop\MyVIew\WebVtt\src\captions.en.vtt 无效数字 (3:0) 您可能需要适当的加载程序来处理此文件类型。

有人可以帮帮我吗？

Answer 1

您需要适合文件类型 (.vtt) 的加载器。

安装file-loader (npm install --save-dev file-loader) 就可以直接这样使用了：

var data = require('file-loader!./captions.en.vtt');