角度9 videogular2无法解析为NgModule

时间:2020-04-13 16:47:14

标签: angular typescript videogular2

当我通过官方教程安装videogular2时,我正在开发一个angular 9应用并遇到问题,但在集成videogular2时一切正常,直到我尝试为项目提供服务,然后出现这些错误为止

node_modules / videogular2 / src / core / core.d.ts:29:22中的错误-错误NG6002:出现在VideoPlayerModule的NgModule.imports中,但无法解析为NgModule类

29 export声明类VgCoreModule { ~~~~~~~~~~~~ node_modules / videogular2 / src / controls / controls.d.ts:1:22-错误NG6002:出现在VideoPlayerModule的NgModule.imports中,但无法解析为NgModule

1个导出声明类VgControlsModule { ~~~~~~~~~~~~~~~ node_modules / videogular2 / src / overlay-play / overlay-play.d.ts:1:22-错误NG6002:出现在NgModule中。VideoPlayerModule的输入,但无法解析为NgModule类

1个导出声明类VgOverlayPlayModule { ~~~~~~~~~~~~~~~~~~~ node_modules / videogular2 / src / buffering / buffering.d.ts:1:22-错误NG6002:出现在VideoPlayerModule的NgModule.imports中,但是无法解析为NgModule类

1个导出声明类VgBufferingModule { ~~~~~~~~~~~~~~~~ node_modules / videogular2 / src / streaming / streaming.d.ts:6:22-错误NG6002:出现在VideoPlayerModule的NgModule.imports中,但无法显示解析为NgModule类

6导出声明类VgStreamingModule { ~~~~~~~~~~~~~~~~ src / app / apps / video-player / video-player.module.ts:42:14-错误NG6002:出现在AppsModule的NgModule.imports中,但本身有错误

42个导出类VideoPlayerModule ~~~~~~~~~~~~~~~~ src / app / apps / apps.module.ts:29:14-错误NG6002:出现在AppModule的NgModule.imports中,但本身有错误< / p>

29个导出类AppsModule ~~~~~~~~~~

** Angular Live Development Server正在localhost:7777上侦听,请在http://localhost:7777/上打开浏览器**

这是我的package.json文件

{
"name": "test",
"version": "9.0.0",
"scripts": {
    "ng": "ng",
    "start": "ng serve --open",
    "start-hmr": "ng serve --configuration hmr --source-map=false --hmr-warning=false",
    "start-hmr-sourcemaps": "ng serve --configuration hmr --source-map=true --hmr-warning=false",
    "build": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev",
    "build-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev --stats-json",
    "build-prod": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod",
    "build-prod-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod --stats-json",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "bundle-report": "webpack-bundle-analyzer dist/stats.json"
},
"private": true,
"dependencies": {
    "@agm/core": "1.1.0",
    "@angular/animations": "9.0.0",
    "@angular/cdk": "9.0.0",
    "@angular/common": "9.0.0",
    "@angular/compiler": "9.0.0",
    "@angular/core": "9.0.0",
    "@angular/flex-layout": "9.0.0-beta.29",
    "@angular/forms": "9.0.0",
    "@angular/material": "9.0.0",
    "@angular/material-moment-adapter": "9.0.0",
    "@angular/platform-browser": "9.0.0",
    "@angular/platform-browser-dynamic": "9.0.0",
    "@angular/router": "9.0.0",
    "@auth0/angular-jwt": "4.0.0",
    "@ngrx/effects": "8.6.0",
    "@ngrx/router-store": "8.6.0",
    "@ngrx/store": "8.6.0",
    "@ngrx/store-devtools": "8.6.0",
    "@ngx-translate/core": "12.0.0",
    "@swimlane/dragula": "3.8.0",
    "@swimlane/ngx-charts": "13.0.2",
    "@swimlane/ngx-datatable": "16.0.3",
    "@swimlane/ngx-dnd": "8.1.0",
    "@types/prismjs": "1.16.0",
    "angular-calendar": "0.28.2",
    "angular-in-memory-web-api": "0.9.0",
    "chart.js": "2.9.3",
    "classlist.js": "1.1.20150312",
    "d3": "5.15.0",
    "date-fns": "2.9.0",
    "hammerjs": "2.0.8",
    "lodash": "4.17.15",
    "moment": "2.24.0",
    "ng2-charts": "2.3.0",
    "ngrx-store-freeze": "0.2.4",
    "ngx-bar-rating": "^1.1.0",
    "ngx-color-picker": "8.2.0",
    "ngx-cookie-service": "2.3.0",
    "ngx-spinner": "9.0.1",
    "perfect-scrollbar": "1.4.0",
    "prismjs": "1.19.0",
    "rxjs": "6.5.4",
    "tslib": "1.10.0",
    "videogular2": "^6.1.1",
    "web-animations-js": "2.3.2",
    "zone.js": "0.10.2"
},
"devDependencies": {
    "@angular-devkit/build-angular": "0.900.1",
    "@angular/cli": "9.0.1",
    "@angular/compiler-cli": "9.0.0",
    "@angular/language-service": "9.0.0",
    "@angularclass/hmr": "2.1.3",
    "@types/core-js": "2.5.3",
    "@types/jasmine": "3.5.2",
    "@types/jasminewd2": "2.0.8",
    "@types/lodash": "4.14.149",
    "@types/node": "12.12.6",
    "codelyzer": "5.2.1",
    "jasmine-core": "3.5.0",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "4.3.0",
    "karma-chrome-launcher": "3.1.0",
    "karma-coverage-istanbul-reporter": "2.1.1",
    "karma-jasmine": "2.0.1",
    "karma-jasmine-html-reporter": "1.5.1",
    "protractor": "5.4.3",
    "ts-node": "8.3.0",
    "tslint": "5.18.0",
    "typescript": "3.7.5",
    "webpack-bundle-analyzer": "3.6.0"
}

}

这是我的模块

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

import { VideoPlayerComponent } from './video-player.component';
import { CommonModule } from '@angular/common';
import { MatCardModule } from '@angular/material/card';

import { VgCoreModule } from 'videogular2/core';
import { VgControlsModule } from 'videogular2/controls';
import { VgOverlayPlayModule } from 'videogular2/overlay-play';
import { VgBufferingModule } from 'videogular2/buffering';
import { VgStreamingModule } from 'videogular2/streaming';

import { AuthGuard } from '../auth/auth.guards/auth.guard';


const routes = [
    {
        path     : 'video',
        component: VideoPlayerComponent,
        canActivate: [AuthGuard]
        // resolve  : {
        //     profile: ProfileService
        // }
    }
];
@NgModule({
    declarations: [VideoPlayerComponent],
    imports: [
        CommonModule,
        MatCardModule,

        VgCoreModule,
        VgControlsModule,
        VgOverlayPlayModule,
        VgBufferingModule,
        VgStreamingModule,
        RouterModule.forChild(routes)

    ]
})
export class VideoPlayerModule
{
}

3 个答案:

答案 0 :(得分:3)

Videogular2目前还不支持角度9。

按照此ngx-videogular的建议,您可以使用此github issue(videogular2的叉子)直到添加支持。

另一个选项是禁用常春藤,如其他答案所示。但是,这样做会失去Ivy的所有好处。

答案 1 :(得分:1)

从版本9开始,默认情况下enableIvy标志的值设置为true。

“ angularCompilerOptions”:{ “ enableIvy”:假 }

解决我的问题

答案 2 :(得分:0)

我遇到了同样的问题,请确保您已安装

  1. tslint
  2. 打字稿

本地或全球

npm i -g tslint --f && npm i -g typescript --f