使用react-video-player组件出现报错，寻求技术协助

我最近在项目里尝试集成video-react库的Player组件来实现视频播放功能，但把组件应用到页面时出现了报错。我已经附上了报错截图：

以下是我的自定义VideoPlayer组件代码：

import React, { Component } from "react";
import "video-react/dist/video-react.css";
import { Player } from 'video-react';

class VideoPlayer extends Component {
  render() {
    return(
      <Player
        playsInline
        poster="/assets/poster.png"
        src="https://media.w3.org/2010/05/sintel/trailer_hd.mp4"
      />
    );
  }
}

export default VideoPlayer;

同时，我也提供了可能有助于排查问题的webpack配置文件：

/* eslint comma-dangle: ["error", {"functions": "never", "arrays": "only-multiline", "objects": "only-multiline"} ] */
const webpack = require('webpack');
const pathLib = require('path');
const devBuild = process.env.NODE_ENV !== 'production';

const config = {
  entry: [
    'es5-shim/es5-shim',
    'es5-shim/es5-sham',
    'babel-polyfill',
    './app/bundles/HelloWorld/startup/registration',
  ],
  output: {
    filename: 'webpack-bundle.js',
    path: pathLib.resolve(__dirname, '../app/assets/webpack'),
  },
  resolve: {
    extensions: ['.js', '.jsx'],
  },
  plugins: [
    new webpack.EnvironmentPlugin({ NODE_ENV: 'development' }),
  ],
  module: {
    rules: [
      {
        test: require.resolve('react'),
        use: {
          loader: 'imports-loader',
          options: {
            shim: 'es5-shim/es5-shim',
            sham: 'es5-shim/es5-sham',
          }
        },
      },
      {
        test: /\.jsx?$/,
        use: 'babel-loader',
        exclude: /node_modules/,
      },
    ],
  },
};

module.exports = config;

if (devBuild) {
  console.log('Webpack dev build for Rails'); // eslint-disable-line no-console
  module.exports.devtool = 'eval-source-map';
} else {
  console.log('Webpack production build for Rails'); // eslint-disable-line no-console
}

恳请各位帮忙排查并解决这个报错问题，非常感谢！

内容的提问来源于stack exchange，提问作者Subhojit