1

I updated quite sizable project to angular 14.On one particular route config I get the following error when I click on a link to redirect.

Error: NG04014: Invalid configuration of route 'publication/:id/:slug/'. One of the following must be provided: component, loadComponent, redirectTo, children or loadChildren

The configuration of the routes is like so


import { Route } from '@angular/router';

export const PublicationRoutes: Route[] = [
    {
        path: 'publications',
        loadChildren: () => import('./modules/publication-listing/publication-listing.module').then(m => m.PublicationListingModule)
    },
    {
        path: 'publication/create',
        loadChildren: () => import('./modules/publication-modify/publication-modify.module').then(m => m.PublicationModifyModule),
        pathMatch: 'full'
    },
    {
        path: 'publication/:id/edit',
        loadChildren: () => import('./modules/publication-modify/publication-modify.module').then(m => m.PublicationModifyModule),
        pathMatch: 'full'
    },
    {
        path: 'publication/:id/:slug',
        loadChildren: () => import('./modules/publication-view/publication-view.module').then(m => m.PublicationViewModule),
    },
    {
        path: 'publication',
        redirectTo: 'publications',
        pathMatch: 'full'
    }
];

The puzzling part is that there is the exact same configuration on a different route, and it works fine there. I tried to look for differences, but I find none. The error doesnt make sense because there is loadChildren. Has anyone encountered something similar?

  • You have `publication` twice. Remove one of them. Also, the first route will always be true because it is not `pathMatch: 'full'` – Akxe Jan 19 '23 at 11:19
  • No one of them is plural. Publication (singular) redirects to publications. This was from a point where we sanitized old urls to redirect to correct paths. Also with or without pathMatch: 'full' the error is still: *Error: NG04014: Invalid configuration of route 'publication/:id/:slug/'. One of the following must be provided: component, loadComponent, redirectTo, children or loadChildren* – SkyLordPanglot Jan 20 '23 at 09:54
  • If you remove the slug path, will it work? Maybe you could retype it, in case some invisible character got in there – Akxe Jan 20 '23 at 10:04
  • I tried it with and without slug as well. The thing is before the update it worked perfectly fine. It is something that they changed between versions. Something in the way that they manage the routing. I updated from 10 to 14, step by step 10 -> 11, 11 -> 12 and so on. However I am not sure in which version update this happened, since I was fixing the errors, but didnt check every route. – SkyLordPanglot Jan 20 '23 at 12:30
  • In my case, when this sort of thing happens, I will try to rename the object, rewrite it by hand, and test every added part to see if it works or starts beaking. – Akxe Jan 20 '23 at 13:05
  • 1
    Please post the routing of publication-view.module I am pretty sure you have a route there without component, loadComponent, redirectTo, children or loadChildren – bnGG Mar 02 '23 at 10:39
  • in my case I had an empty value like `{ }` with some comments inside... – Oscar TJ Jun 27 '23 at 13:11

0 Answers0