Как использовать video.js с create-next-app nextjs? - PullRequest
Новая
       53

Как использовать video.js с create-next-app nextjs?

0 голосов
/ 06 июня 2018

Я пытаюсь использовать Video.js с create-next-app, и мне не удается загрузить video.js.css.Вот так выглядит мой компонент. 

import videojs from 'video.js'

import videoStyles from '../node_modules/video.js/dist/video-js.min.css'

export default class VideoPlayer extends React.Component {
  componentDidMount() {
    // instantiate Video.js
    this.player = videojs(this.videoNode, this.props, function onPlayerReady() {
      console.log('onPlayerReady', this)
    });
  }

  // destroy player on unmount
  componentWillUnmount() {
    if (this.player) {
      this.player.dispose()
    }
  }

  // wrap the player in a div with a `data-vjs-player` attribute
  // so videojs won't create additional wrapper in the DOM
  // see https://github.com/videojs/video.js/pull/3856
  render() {
    return (
      <div>    
        <div data-vjs-player>
          <video ref={ node => this.videoNode = node } className="video-js"></video>
        </div>
        <style jsx>{videoStyles}</style>
      </div>
    )
  }
}

Я использую styled-jsx / css loader для загрузки внешнего файла css.

...