时间戳

首页 > 解决方案 > Angular VideoJs VR 导入问题

angular - Angular VideoJs VR 导入问题

问题描述

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

我对 Angular 有点陌生，目前在尝试使用 VideoJs VR 时遇到了一些问题。虽然 VideoJs 工作正常，但当尝试将 VR 用于 360 度视频时，控制台中会出现以下错误：（（ video.es.js:97 VIDEOJS: ERROR: TypeError: three_examples_js_effects_VReffect_js__WEBPACK_IMPORTED_MODULE_8___default.a is not a constructor ））

屏幕截图：控制台错误

这就是我包含 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});
  }

}

编辑_1：

这些文件和可能更多的文件在三中不存在，解决方案是降级三吗？如果是这样，我会尝试并结束我的问题。

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';

编辑_2：

所以我很愚蠢，文件是存在的，videojs-vr 有它自己的 node_modules 和这个特定的过时的三个版本。

标签： angularthree.jsvideo.js

解决方案

在最后一次尝试修复它时，如果发现这个：https ://fmoralesdev.com/2019/10/23/using-external-js-files-in-angular/ 所以是的，它现在可以工作了，我只需要包括它正确。

感谢您帮助@Gytis TG

推荐阅读