Я не могу понять, как получить видео html5 для рендеринга в приложении реагирования из локальных файлов. Буквально единственный способ, которым я смог заставить это работать, - это так:

<video src="http://www.w3schools.com/html/movie.mp4" controls />

Вот что я пробовал

1. Включая путь напрямую

<video src={require('path/to/file.mp4')} controls />

который возвращает ошибку

Module parse failed: /path/to/file.mp4 Line 1: Unexpected token ILLEGAL
You may need an appropriate loader to handle this file type.

2. Добавление этих загрузчиков по одному в конфигурацию webpack

{
  test: /\.(mp4)$/,
  loader: 'file'
  // loader: 'url-loader'
  // loader: 'url-loader?limit=100000'
  // loader: 'file-loader'
  // loader: 'file-loader?name=videos/[name].[ext]'
},

это выкладывало следующую ошибку в браузере

GET http://localhost:3000/530c2bf99dad0f857d46940b62b84946.mp4 404 (Not Found)

3. Я пытался добавить прямой URL-адрес в файл

<video src={require('http://localhost:3000/path/to/file.mp4')} controls />

но все же ошибки:

Module not found: Error: Cannot resolve module 'http://localhost:3000/path/to/file.mp4' in path/to/file.mp4

4. Я попытался добавить расширение mp4 в конфигурацию моего веб-пакета.как этот человек сделал

{
  test: /\.jpe?g$|\.gif$|\.png$|\.ico|\.svg$|\.woff$|\.ttf$|.mp4$/,
  loader: 'url-loader?limit=8192'
}

но не повезло

5. Я начал внедрятьWebPack-изоморфные-инструменты но тогда я не был уверен, было ли это правильное направление, поэтому я остановился на этом. Кажется, у этого парня все получилось. (посмотреть файл)

Я также заметил в документации веб-пакета подсоглашения о загрузчиках тотfile-loader загрузит видео файлы.Означает ли это, что веб-пакет не будет загружать другие типы видео, такие как.mov, .vob, .avi, etc.?

Если вы хотите взглянуть на код,вот хранилище.

Ресурсы