4

This is my data structure

WEBVTT

00:00:15.000 --> 00:00:17.951 At the left we can see...

00:00:18.166 --> 00:00:20.083 At the right we can see the...

00:00:20.119 --> 00:00:21.962 ...the head-snarlers

I am trying to parse a web vtt file. For this I wrote : 

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

Error

client:47 ./src/captions.en.vtt Module parse failed: C:\Users\sampr\Desktop\MyVIew\WebVtt\src\captions.en.vtt Invalid number (3:0) You may need an appropriate loader to handle this file type.

Could someone please help me?

funkadelic
  • 83
  • 10

2 Answers2

2

You need a appropriate loader for the file type (.vtt).

Install file-loader (npm install --save-dev file-loader) and you could use it directly like this: 

var data = require('file-loader!./captions.en.vtt');
Robert Bue
  • 1,774
  • 2
  • 11
  • 14
0

Using Next.js, I ended up using this solution.

...add a file called staticdata.js inside the pages/api folder. This will create a Serverless Function that will load the json data from the file, and return it as a response.

Basically the solution is to return the data from an API endpoint.

Emre
  • 831
  • 11
  • 13