mgechev / mgechev/ngx-quicklink

Appears in the NgModule.imports of AppRoutingModule, but could not be resolved to an NgModule class

Open
#129 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
757
Forks
43
PR merge metrics
No merged PRs in 30d

Description

Tried to use `ngx-quicklink` with the angular 13 but the compilation is failing with the below logs. Any quick fix can help or let me know it’s a bug.

I'm using the latest version of `ngx-quicklink` with angular 13, which seems to not be compatible.

```sh
Error: node_modules/ngx-quicklink/src/quicklink-strategy.service.d.ts:4:22 - error NG6002: Appears in the NgModule.imports of AppRoutingModule, but could not be resolved to an NgModule class.

This likely means that the library (ngx-quicklink) which declares QuicklinkStrategy has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of the library is available, and update if so. Also consider checking with the library's authors to see if the library is expected to be compatible with Ivy.

4 export declare class QuicklinkStrategy implements PreloadingStrategy {
~~~~~~~~~~~~~~~~~

Error: src/app/app-routing.module.ts:28:14 - error NG6002: Appears in the NgModule.imports of AppModule, but itself has errors

28 export class AppRoutingModule { }
~~~~~~~~~~~~~~~~

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

✖ Failed to compile.
✔ Browser application bundle generation complete.

Initial Chunk Files | Names | Raw Size
runtime.js | runtime | 6.53 kB |

4 unchanged chunks

Build at: 2022-05-20T21:21:25.334Z - Hash: 3edae2a5a13ab56c - Time: 401ms

```

Here is my `app-routing.module.ts`

```ts
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { QuicklinkStrategy } from 'ngx-quicklink';
import { ViewsModule } from './views/views.module';

const routes: Routes = [
{
path: '',
pathMatch: 'full',
redirectTo: 'home'
},
{
path: 'home',
loadChildren: () => import('./views/views.routing.module')
.then((m) => ViewsModule), data: {
shouldPreload: true
}
}
];

@NgModule({
imports: [
QuicklinkStrategy,
RouterModule.forRoot(routes, {preloadingStrategy: QuicklinkStrategy})
],
exports: [RouterModule]
})
export class AppRoutingModule { }

```

Here is the `app.modules.ts`

```ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { ComponentsModule } from './components/components.module';
import { ViewsModule } from './views/views.module';

@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule,
ViewsModule,
ComponentsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

```

Any contribution is much aplicieted.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the Angular 13 compilation failure from app-routing.module.ts, focusing on the QuicklinkStrategy import and the error in ngx-quicklink/src/quicklink-strategy.service.d.ts. Compare the library's Angular compatibility with the reported setup and verify that the Angular 13 build succeeds with the intended routing configuration.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend, performance
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.