pipe(shareReplay()) causing webpackError in route resolver | Angular Community | Page 1

So i built a route resolver:

@Injectable({providedIn: 'root'})
export class HighlightsResolver implements Resolve<ListingOverview[]> {

  constructor(private apiService: ApiService) {}

  resolve(): Observable<ListingOverview[]> {
    const highlights$ = this.apiService.getHighlightListings().pipe(shareReplay());
    highlights$.subscribe();
    return highlights$;
  }
}

and bind to it in the component like this:

export class HighlightsComponent implements OnInit {
  highlights$: Observable<ListingOverview[]>;

  constructor(
    activatedRoute: ActivatedRoute
  ) {
    this.highlights$ = activatedRoute.data.pipe(map(data => data['highlights$']));
  }

  ngOnInit(): void { }
}

Which causes this error:

bootstrap:19 Uncaught TypeError: __webpack_modules__[moduleId] is not a function
    at __webpack_require__ (bootstrap:19:1)
    at 158 (main.js:16:62)
    at __webpack_require__ (bootstrap:19:1)
    at 6747 (app.component.html:1:40)
    at __webpack_require__ (bootstrap:19:1)
    at 4431 (environment.ts:16:71)
    at __webpack_require__ (bootstrap:19:1)
    at __webpack_exec__ (main.ts:23:3)
    at main.ts:23:3
    at __webpack_require__.O (chunk loaded:23:1)

This totally works if i remove the share replay

#pipe(shareReplay()) causing webpackError in route resolver