question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

RxJS 6.x has changed how we import its modules and operators, causing this package to throw some errors. Should just be a matter of adjusting the imports:

ERROR in node_modules/ng-block-ui/lib/services/block-ui-instance.service.d.ts(1,10): error TS2305: Module ‘“C:/Dev/testblockui/node_modules/rxjs/Observable”’ has no exported member ‘Observable’. node_modules/rxjs/Observable.d.ts(1,15): error TS2307: Cannot find module ‘rxjs-compat/Observable’.

Fixing this import gives way to more errors:

ERROR in ./node_modules/ng-block-ui/lib/services/block-ui-instance.service.js Module not found: Error: Can’t resolve ‘rxjs/ReplaySubject’ in ‘C:\Dev\testblockui\node_modules\ng-block-ui\lib\services’ ERROR in ./node_modules/ng-block-ui/lib/components/block-ui-content/block-ui-content.component.js Module not found: Error: Can’t resolve ‘rxjs/add/operator/map’ in ‘C:\Dev\testblockui\node_modules\ng-block-ui\lib\components\block-ui-content’

package.json:

  "dependencies": {
    "@angular/animations": "^6.0.0",
    "@angular/common": "^6.0.0",
    "@angular/compiler": "^6.0.0",
    "@angular/core": "^6.0.0",
    "@angular/forms": "^6.0.0",
    "@angular/http": "^6.0.0",
    "@angular/platform-browser": "^6.0.0",
    "@angular/platform-browser-dynamic": "^6.0.0",
    "@angular/router": "^6.0.0",
    "core-js": "^2.5.4",
    "ng-block-ui": "^1.0.4",
    "rxjs": "^6.0.0",
    "zone.js": "^0.8.26"
  },

Steps to reproduce:

ng new testblockui
npm install ng-block-ui --save

Add the import to app.module:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { BlockUIModule } from 'ng-block-ui'; 

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BlockUIModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Serve:

ng serve

App generated with Angular CLI: Angular CLI: 6.0.0 Node: 8.11.1 OS: win32 x64

Note: edited several times for spelling and clarity

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:21 (13 by maintainers)

github_iconTop GitHub Comments

6reactions
kuuurt13commented, Jul 20, 2018

I have published ng-block-ui@2.0.0-beta.1 which adds support for Angular 6 and RXjs 6. Please install (npm i --save ng-block-ui@next) and try it out in your Angular 6. Let me know if any of you run into any issues.

4reactions
kuuurt13commented, Jul 12, 2018

@tamilsweet, I have looked into this and I am now working on a 2.0.0 version. Which will support the new version of rxjs.

Read more comments on GitHub >

github_iconTop Results From Across the Web

RxJS 6: What's new and what has changed? - Auth0
RxJs 6 is out and with it new exciting additions and changes! Ben Lesh highlights that RxJS 6 brings cleaner imports while having...
Read more >
RxJS v5 -> v6 Upgrade - Learn RxJS
... 6. Auto-update project for new import paths and transition to pipeable operators. ... Comprehensive guide for updating your project from RxJS v5...
Read more >
Right way to upgrade RxJS to latest version? - Stack Overflow
The easiest way to force upgrade any package would be to do append an @latest to the required package. In our use case...
Read more >
Angular 6: Upgrading API calls to RxJS 6 - Metal Toad
Once you have updated your project to the new RxJS 6 syntax, the next step is to remove "rxjs-compat" from your package.json file...
Read more >
RxJS v5.x to V6 Update Guide - W3cubDocs
RxJS v6 has arrived! While this is a major version change (from 5.x to 6.x), we've put in a lot of work to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found