Angular 6 videojs-record 导致运行时错误答案

【问题标题】：Angular 6 videojs-record results in runtime errorAngular 6 videojs-record 导致运行时错误
【发布时间】：2018-10-07 08:48:08
【问题描述】：

我正在使用 Angular 6 和 videojs-record 插件。我在项目中配置了以下依赖项。

npm install --save video.js
npm install --save videojs-record

后来我使用下面的 import 语句引用了 videojs 插件。

import videojs from 'video.js';
import 'webrtc-adapter';
import RecordRTC from 'recordrtc';
import Record from 'videojs-record/dist/videojs.record.js';

虽然在编译时没有报告错误，但当我点击浏览器时，我会在控制台中收到以下错误。

Uncaught ReferenceError: global is not defined
    at Object../node_modules/webrtc-adapter/src/js/adapter_core.js (adapter_core.js:13)
    at __webpack_require__ (bootstrap:78)
    at Module../src/app/app.component.ts (main.js:93)
    at __webpack_require__ (bootstrap:78)
    at Module../src/app/app.module.ts (app.component.ts:13)
    at __webpack_require__ (bootstrap:78)
    at Module../src/main.ts (main.ts:1)
    at __webpack_require__ (bootstrap:78)
    at Object.0 (main.ts:12)
    at __webpack_require__ (bootstrap:78)

请告诉我，我在这里缺少什么？

版本信息：

"video.js": "^7.2.3",
"videojs-record": "^2.4.1",
"@angular/compiler": "^6.0.3",
"@angular/core": "^6.0.3",

UPDATE-1： 如果我从

更改 webrtc-adapter 导入

import 'webrtc-adapter'

到

import 'webrtc-adapter/out/adapter_no_global.js';

videojs 失败并出现以下错误。

ERROR Error: plugin "record" does not exist
    at Player.<anonymous> (video.es.js:19615)
    at Array.forEach (<anonymous>)
    at new Player (video.es.js:19611)
    at videojs$1 (video.es.js:24059)
    at AppComponent.push../src/app/app.component.ts.AppComponent.startRecording (app.component.ts:43)
    at Object.eval [as handleEvent] (AppComponent.html:5)
    at handleEvent (core.js:10251)
    at callWithDebugContext (core.js:11344)
    at Object.debugHandleEvent [as handleEvent] (core.js:11047)
    at dispatchEvent (core.js:7710)

UPDATE-2：

我尝试使用 Angular cli 定制器 (https://github.com/nfriend/angular-cli-customizer) 并按照https://github.com/collab-project/videojs-record/wiki/Angular 中指定的说明进行操作

不幸的是，这也没有用:(

【问题讨论】：

你安装 webrtc-adapter 了吗？
我没有专门安装它，但它存在于 node_modules 目录中。我猜它是由于传递依赖而下载的。
这看起来您使用的是主版本，而不是 NPM 上发布的版本之一。试试npm版本，这可能是master的一个bug。
我正在使用以下版本 - "video.js": "^7.2.3", "videojs-record": "^2.4.1",

标签： angular webpack angular6 video.js angular-webpack

【解决方案1】：

我遇到了同样的问题，但我使用以下方法解决了它，您的 "videojs-record/dist/videojs.record.js" 文件未加载到该特定组件上，因此请尝试从 component.ts 文件动态加载它 p>

更多参考请看下面的链接 Dynamically load external javascript file from Angular component

【讨论】：