Angular 10 to 12 update causing error Uncaught RangeError: Wrong length

user_15984667 0
Viewed 248

I have just upgraded my Angular application from version 10 to version 12 and when I run 'ng serve' there are no build errors, but then in the console it gives me the error "Uncaught RangeError: Wrong length!" from _typed-buffer.js:157. In the stack trace there is app-routing.module.ts:104 and auth-guard.service.ts:12 towards the bottom. I am not sure how to get past this error. None of the application loads because of this. On auth-guard.service.ts line 12 there is

@Injectable()
export class AuthGuardService implements CanActivate {

constructor(private authService: AuthService, private router: Router, private location: Location) {}

I have tried updating to latest node and npm versions 14.17.0 and 7.13.0. I have tried ng update and updating all my packages. Just can't seem to get past this error. There is not much when I search google about this error and Angular 12. Has anybody had this issue?

angular web javascript
1 Answers

According to documentation, there are some changes migrating from angular 10 to angular 12 that have to do with router and you maybe have to solve manualy

If you use the router, the default value of relativeLinkResolution has changed from legacy to corrected. If your application previously used the default by not specifying a value in the ExtraOptions and uses relative links when navigating from children of empty path routes, you will need to update your RouterModule's configuration to specifically specify legacy for relativeLinkResolution. See the documentation for more details.

And

routerLinkActiveOptions property of RouterLinkActive now has a more specific type. You may need to update code accessing this property to align with the changes.

And

In the Angular Router, the options deprecated in v4 for initialNavigation have been removed. If you previously used enabled or true, now choose enabledNonBlocking or enabledBlocking.

And

If you previously used false or legacy_disabled, now use disabled. In the Angular Router's routerLink, preserveQueryParams has been removed, use queryParamsHandling="preserve" instead.

And

If you were accessing the routerLink values of queryParams, fragment or queryParamsHandling you might need to relax the typing to also accept undefined and null

More possible things to explore here

user_72378840
Related