Angular VideoJs VR导入问题

问题描述

但是，这可能是一个愚蠢的问题。

我是Angular的新手，目前在尝试使用VideoJs VR时遇到一些问题。虽然VideoJs可以正常工作，但是当尝试将VR用于360deg Video时，控制台中出现以下错误：（（（video.es.js：97 VIDEOJS：错误：TypeError：three_examples_js_effects_VREffect_js__WEBPACK_IMPORTED_MODULE_8 ___ default.a不是构造函数））

Screenshot: Console Error

这就是我包含VideoJs文件的方式：

import {Component,OnInit} from '@angular/core';
import videojs from 'video.js';
import 'videojs-vr';

@Component({
  selector: 'app-video-player',templateUrl: './video-player.component.html',styleUrls: ['./video-player.component.scss']
})
export class VideoPlayerComponent implements OnInit {

  player: videojs.player;

  constructor() {
  }

  ngOnInit(): void {
    this.player = videojs('videojs-vr-player');
    this.player.mediainfo = this.player.mediainfo || {};
    this.player.mediainfo.projection = '360';
    this.player.vr({projection: 'AUTO',debug: true,forceCardboard: false});
  }

}

edit_1：

这些文件以及可能更多的文件不存在于Three中，解决方案是否降级为Three？如果是这样，我会尝试并结束我的问题。

node_modules / videojs-vr / dist / videojs-vr.es.js ::

import VREffect from 'three/examples/js/effects/VREffect.js';
import OrbitControls from 'three/examples/js/controls/OrbitControls.js';

edit_2：

所以我很傻，文件已经存在，videojs-vr拥有自己的node_modules和这个特定的过时的三个版本。

解决方法

最后一次尝试修复它时，发现以下问题：https://fmoralesdev.com/2019/10/23/using-external-js-files-in-angular/ 所以是的，现在可以使用，我只需要适当地添加它即可。

感谢@Gytis TG的帮助

angular angular three.js video.js