flex-layout not compatible with Angular 5.0 because of OpaqueToken

[ajspeller]

Bug, feature request, or proposal:

Request - Approximately when will the software but updated to be compatible with Angular 5.0

What is the expected behavior?

To remove the usage of opaque tokens because it has been removed from Angular 5.0

What is the current behavior?

When attempting to build my application I see the following error.

ERROR in node_modules/@angular/flex-layout/media-query/breakpoints/break-points.d.ts(8,10): ... has no exported member 'OpaqueToken'.

What are the steps to reproduce?

Providing a StackBlitz (or similar) is the best way to get the team to see your issue.

• StackBlitz starter using latest npm nightly release:

Just install Angular 5.0 and @angular/flex-layout: 2.0.0-rc.1

What is the use-case or motivation for changing an existing behavior?

To be able to code with the most current software.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 5.0
Material 5.0.0-rc0
Windows 10
typescript: 2.4.2
Chrome Version 60.0.3112.90 (Official Build) (64-bit)

Is there anything else we should know?

[boulix3]

You should use use beta.10 instead of rc.1.
I had the same problem. I believe rc.1 was released by mistake.

[ajspeller]

Okay, thanks. I will downgrade.

[joejordanbrown]

I've just had the problem it was due to using ^2.0.0-beta.10 and the incorrectly published RC version being seen as the higher/newer version. So make sure you are not using ^ the latest version is 2.0.0-beta.10-4905443 so you should use npm install @angular/flex-layout@2.0.0-beta.10-4905443 --save.

To be clear your package.json should not be...

"@angular/flex-layout": "^2.0.0-beta.10-4905443",

this will actually install version 2.0.0-rc.1, which was meant to be released as 2.0.0-beta.6 so it is actually older than >= 2.0.0-beta.7 <= 2.0.0-beta.10-4905443.

Until that is fixed, you should use fixed versioning...

"@angular/flex-layout": "2.0.0-beta.10-4905443",

[RainingNight]

+1

[jeudywr]

Using version 2.0.0-beta.10 is not working for me :-(

Other dependencies in my package.json:

    "@angular/cdk": "^5.0.0-rc0",
    "@angular/cli": "^1.5.0",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/compiler-cli": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/flex-layout": "2.0.0-beta.10",
    "@angular/http": "^5.0.0",
    "@angular/language-service": "^5.0.0",
    "@angular/material": "^5.0.0-rc0",

[danwulff]

So after reading all this I'm still not sure if 2.0.0-beta.10-4905443 is fully compatible with Angular 5 or not. What's the status on Ver. 5.0 compatibility?

[ajspeller]

2.0.0-beta.10-4905443 is working for me with Angular 5.

[danwulff]

@ajspeller fantastic, thanks for the reply.

[buratinodev]

I still get the following error:

ERROR in node_modules/@angular/flex-layout/media-query/breakpoints/break-points.d.ts(8,10): error TS2305: Module '"/Users/adyhasch/Documents/Code/Angular/ng-core/node_modules/@angular/core/core"' has no exported member 'OpaqueToken'.

Anyone got any clues? I've grinded to a halt these last weeks ..

 "dependencies": {
    "@angular/animations": "^5.0.1",
    "@angular/cdk": "^5.0.0-rc0",
    "@angular/common": "^5.0.1",
    "@angular/compiler": "^5.0.1",
    "@angular/core": "^5.0.1",
    "@angular/flex-layout": "^2.0.0-beta.10-4905443",
    "@angular/forms": "^5.0.1",
    "@angular/http": "^5.0.1",
    "@angular/material": "^5.0.0-rc0",
    "@angular/platform-browser": "^5.0.1",
    "@angular/platform-browser-dynamic": "^5.0.1",
    "@angular/router": "^5.0.1",
    "angular2-uuid": "^1.1.1",
    "angularfire2": "^5.0.0-rc.3",
    "chart.js": "^2.7.1",
    "core-js": "^2.5.1",
    "firebase": "^4.6.1",
    "hammerjs": "^2.0.8",
    "ng2-charts": "^1.6.0",
    "reflect-metadata": "^0.1.10",
    "rxjs": "^5.5.2",
    "ts-helpers": "^1.1.2",
    "uuid": "^3.1.0",
    "zone.js": "^0.8.18"
  },
  "devDependencies": {
    "@angular/cli": "^1.5.0",
    "@angular/compiler-cli": "^5.0.1",
    "@types/hammerjs": "^2.0.35",
    "@types/jasmine": "^2.6.3",
    "@types/node": "^8.0.50",
    "@types/selenium-webdriver": "^3.0.8",
    "codelyzer": "^4.0.1",
    "jasmine-core": "2.8.0",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "~1.7.1",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.1.0",
    "karma-phantomjs-launcher": "^1.0.4",
    "karma-remap-istanbul": "^0.6.0",
    "protractor": "5.2.0",
    "ts-node": "3.3.0",
    "tslint": "5.8.0",
    "typescript": "^2.4.2",
    "webdriver-manager": "12.0.6"
  }

[alexfung888]

I think we need a FAQ on flex-layout versions. There are uncountably many questions arising from the chaotic version numbers.

[jhfonseca72]

this configuration is working for me, I use the following command npm install @angular/flex-layout@latest --save

"@angular/animations": "^5.0.1", "@angular/cdk": "^5.0.0-rc0", "@angular/common": "^5.0.1", "@angular/compiler": "^5.0.1", "@angular/core": "^5.0.1", "@angular/flex-layout": "^2.0.0-beta.10-4905443", "@angular/forms": "^5.0.1", "@angular/http": "^5.0.1", "@angular/material": "^5.0.0-rc0", "@angular/platform-browser": "^5.0.1", "@angular/platform-browser-dynamic": "^5.0.1", "@angular/platform-server": "^5.0.1", "@angular/router": "^5.0.1", "core-js": "^2.4.1", "hammerjs": "^2.0.8", "rxjs": "^5.4.2", "zone.js": "^0.8.14"

[CaerusKaru]

@alexfung888 Believe me, the team understands your frustrations, and it's been a sore spot since the rollback from rc.1 to beta.7. The solution that the team is working on is posting the next release to 2.0.1 instead of 2.0.0 to make all new versions point to that instead. I don't know if there's an ETA on this fix, but it's in the works, currently tracked by #484

cc @ThomasBurleson

[alexfung888]

@CaerusKaru Yes I understand it takes time to post a new release. I wonder if a FAQ should be a quicker means to help the people who got lost. Or even squarely placing instructions on the readme.md on the master branch.

[CaerusKaru]

@alexfung888 I don't know if @ThomasBurleson would go for adding an FAQ like that to the README, but what you can do is open up a new issue labeled something like:

FAQ: correct Flex-Layout versions

We could keep that open until the issues have been resolved with the next release, hopefully some time in the next few weeks. What do you think?

[alexfung888]

#500