search

ui-router / angular-hybrid

Upgrade an ng1 UI-Router app to a ng1+ng2 hybrid using ng-upgrade
MIT License
167 stars 75 forks source link

After update to 15: UI router error TypeError: this.factory is undefined #585

Closed hheexx closed 1 year ago

hheexx commented 1 year ago

We were already on Angular 15 with angular-hybrid version 14 working fine.

Today I updated to angular-hybrid 15 and site wont load under ng serve with following error:

image

production build looks fine btw

wawyed commented 1 year ago

Can you double check you are using @uirouter/angular-hybrid@15.0.1?

wawyed commented 1 year ago

Also what do you mean production build looks fine?

hheexx commented 1 year ago

Yea, 15.0.1 was in package-lock, I checked.

Also what do you mean production build looks fine?

ng build works and produces good build but ng serve does not work. When I visit website I get blank page and exception above.

wawyed commented 1 year ago

It's going to be difficult for me to debug it without being able to reproduce the issue...

the sample angular hybrid app seems to be working fine https://github.com/ui-router/sample-app-angular-hybrid

hheexx commented 1 year ago

Call stack does not help at all?

wawyed commented 1 year ago

Not really, sorry

pacome35220 commented 1 year ago

Same problem for me with v15.0.1, I can give you a more precise stacktrace :

I don't use ng build or ng serve, I use a custom webpack config.

PS : is it possible to update your exemple of custom webpack config to Angular 15 ?

image image

Thank you for your time.

Camo30 commented 1 year ago

Same here. Seems to be related with this line, which was introduced with the Angular 15 update: https://github.com/ui-router/angular-hybrid/blob/077d8e647226315c7d3818d2b24d8879773c23c7/src/angular-hybrid.ts#L244

What is the purpose of this line? As a workaround it seems to work when downgrading to version 14.

wawyed commented 1 year ago

Hi, the example projects were failing without it. Is the way you bootstrap the app different from the example project? https://github.com/ui-router/sample-app-angular-hybrid

xfh commented 1 year ago

I have the same problem with an Angular 15 hybrid app. Indeed, downgrading to version 14 works.

I think I found the problem - at least I could reproduce in the sample-app-angular-hybrid.

@uirouter/angularjs pulls in @uirouter/core@6.0.8 - core should be on version 6.1.0.

In my app, this causes a typescript compilation error, due to conflicting uirouter/core types. To resolve the conflict, I've added the following override to my package.json (npm uses overrides, yarn uses resolutions):

  "overrides": {
    "@uirouter/core": "6.1.0"
  },
  "resolutions": {
    "@uirouter/core": "6.1.0"
  }

Adding the override to the sampe-app-angular-hybrid repo causes the runtime error as reported in this issue.

Conclusion:

Current workaround:

pacome35220 commented 1 year ago

@xfh I want to use Angular v15 and downgrading ui-router to version v14 is not possible for me because I'm using npm v8, and npm install fails because the resolution of the dependency tree is stricter with npm v8, so I get an error during npm install.

image

xfh commented 1 year ago

Ultimately, you are depending on @uirouter/angularjs@1.0.30 - otherwise you wouldn't need angular-hybrid.

@uirouter/angularjs hasn't been maintained since 2 years. It still depends on @uirouter/core 6.0.8. I'd be very surprised if you didn't have these dependency conflicts before. Even with uirouter/angular-hybrid 15, you will have a dependency conflict due to uirouter/angularjs. It has nothing to do with npm v8.

In the absence of a new release, all you can do is to ignore the well-meant advise of npm and enforce the package installation - hoping that there is no API incompatibility. uirouter/angularjs is the reason I've allowed legacy-peer-deps.

wawyed commented 1 year ago

I'll try to change ui-router/angularjs to use peerDependencies for uirouter/core when I get some free time. Would that solve the issues you've been having?

pacome35220 commented 1 year ago

Unfortunately I don't want to allow legacy-peer-deps using --force or --locagy-peer-deps in my CI/CD pipeline because it might cause other problems later for others packages.

I had no dependency conflicts before because @uirouter/core was in 6.0.8 in all @uirouter packages.

The solution I found is a to update subdependencies npm update @uirouter/core to 6.1.0.

image

Now there are 2 versions of @uirouter/core :

and it works.

It's maybe not related to this issue but in my project but :

xfh commented 1 year ago

I'll try to change ui-router/angularjs to use peerDependencies for uirouter/core when I get some free time. Would that solve the issues you've been having?

Hi @wawyed, allowing 6.x.x peer dependencies in uirouter/angularjs should fix the dependency conflicts, thanks! You will also have to revert your change in angular-hybrid 15 though - you will get the same problem as the original poster.

@pacome35220, do you really want to bundle two versions of uirouter/core? That sounds to me way more fragile... Are you sure both routers use the same configuration? It might not be a problem in a simple app, but if you configure for instance the UrlConfig to e.g. use a custom ParamTypeDefinition, you'd have to do so for each router...

You can easily verify in the sample app, that there are two uirouter/core dependencies bundled:

npm run build -- --source-map
npx source-map-explorer dist/**.js

image

wawyed commented 1 year ago

Okay, I'm working on reverting the changes.

wawyed commented 1 year ago

Alright version 15.0.2 has been released. Please make sure you use either in your package.json:

if you use yarn:

  "resolutions": {
    "@uirouter/core": "^6.1.0"
  },

If you use npm:

  "overrides": {
    "@uirouter/core": "6.1.0"
  },

This should solve the issues for now. I need to get access to uirouter/angularjs before I can fix the peerDep so for now this is the way to get it to work.

xfh commented 1 year ago

Thanks @wawyed, I really appreciate your work, keeping this amazing library alive!

wawyed commented 1 year ago

No worries. Sorry I didn't realise the issue with the dependency that lead to the wrong fix.