smnbbrv / ngx-plyr

Angular 6+ binding for Plyr video & audio player
https://smnbbrv.github.io/ngx-plyr/
MIT License
100 stars 65 forks source link

An accessor cannot be declared in an ambient context. #38

Open nandaks opened 4 years ago

nandaks commented 4 years ago

I am sing ngx-plyr plugin in my angular project. But getting error when imporing module.

ERROR in node_modules/ngx-plyr/lib/plyr/plyr.component.d.ts(9,9): error TS1086: An accessor cannot be declared in an ambient context. node_modules/ngx-plyr/lib/plyr/plyr.component.d.ts(65,17): error TS1086: An accessor cannot be declared in an ambient context.

nandaks commented 4 years ago

Node version : v13.11.0 Npm version : 6.13.7 Angular CLI : 9.0.7 OS : linux x64

My project package.json file "dependencies": { "@angular/animations": "^8.2.14", "@angular/cdk": "~8.2.3", "@angular/common": "~8.2.12", "@angular/compiler": "~8.2.12", "@angular/core": "~8.2.12", "@angular/forms": "~8.2.12", "@angular/material": "^8.2.3", "@angular/platform-browser": "~8.2.12", "@angular/platform-browser-dynamic": "~8.2.12", "@angular/router": "~8.2.12", "crypto-js": "^4.0.0", "hammerjs": "^2.0.8", "jquery": "^3.4.1", "mat-video": "^2.7.2", "ng-image-slider": "^2.2.0", "ngx-owl-carousel-o": "^2.0.1", "ngx-qrcode2": "0.0.9", "ngx-toastr": "^11.3.3", "rxjs": "~6.4.0", "tslib": "^1.10.0", "zone.js": "~0.9.1" }, "devDependencies": { "@angular-devkit/build-angular": "~0.803.15", "@angular/cli": "^8.3.25", "@angular/compiler-cli": "~8.2.12", "@angular/language-service": "~8.2.12", "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "@types/node": "~8.9.4", "codelyzer": "^5.0.0", "jasmine-core": "~3.4.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.1.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~2.0.1", "karma-jasmine-html-reporter": "^1.4.0", "protractor": "~5.4.0", "ts-node": "~7.0.0", "tslint": "~5.15.0", "typescript": "~3.5.3" }

krzysklein commented 4 years ago

I had the same issue - here's workaround:

Set "skipLibCheck": true in tsconfig.json

"compilerOptions": {
    "skipLibCheck": true
}
woeterman94 commented 4 years ago

Any solution for this problem?

krzysklein commented 4 years ago

Forget the above workaround! Upgrading to Angular 9 (which allows TypeScript >= 3.7) solved the problem for me.

nandaks commented 4 years ago

Thanks @krzysklein Upgrading to Angular 9 solved my problem.

namnguyenbk commented 4 years ago

have same issue . I'm using Angular 8.3.26 so upgrading version 9 sounds not good for me cause it will break the old one.

gopal-augment commented 4 years ago

Any solution for this? Same error I'm getting

namnguyenbk commented 4 years ago

@gopal-augment this one hasn't been fixed yet. anyway I found another solution: You don't need to use this package cause this one is just a customized version of Plyr which is a package for streaming video. https://www.npmjs.com/package/plyr the documentation is really helpful and a small example are provided here https://stackblitz.com/edit/angular-plyr

smnbbrv commented 4 years ago

Hi folks,

The bug is originated at the angular 9 nature of the angular cli in this lib’s build process and I am not sure there is a way to deal with this.

However you always have an option to use version 3.0.1 of this lib https://github.com/smnbbrv/ngx-plyr/blob/master/CHANGELOG.md

It has the same functionality but it has embedded typings.

Just npm i ngx-plyr@^3.0.0.

Here is the relevant documentation and source code for the version 3.0.1

https://github.com/smnbbrv/ngx-plyr/tree/v3.0.1

@namnguyenbk be careful with the example you provide; it might be unperformant because it does not run events outside angular zone + it gets the HTML element by id which is also not really an appropriate way in Angular component.

namnguyenbk commented 4 years ago

thanks. but that was the only way I could do by that time