Can route-reuse-strategy workaround?

[werts]

Hi, thanks for the greate single-spa-angular solution and the same as single-spa In my application,we implemented the called tab-navigtion by angular's RouteReuseStrategy. and is there a way for single-spa-angular? since some errors throwed by @angular/router that

if (curr.value.routeConfig !== result.value.routeConfig) {
    throw new Error('Cannot reattach ActivatedRouteSnapshot created from a different route');
  }

and how can i make it workaround?

[joeldenning]

I'm not sure on this one. @arturovt do you have thoughts on it?

[arturovt]

@werts hey. Could you provide a minimal reproducible example? Thank you.

[werts]

@joeldenning @arturovt thanks a lot. The minimal rep here https://github.com/werts/single-spa-demo.git and the app1 and the app2 have their own route-reuse-strategy under shared dir. something additional should be done yourself. for example, deploy-url my desire is that navigation between app1 and app2 should not lost their states. i have tried to remove the default unmount lifecycle function,and the route-reuse-strategy's class inited when navigation started. btw,thanks a lot if you provide another solution for so called tab-navigation. I didn't implement the tab, I am just trying to see if it is possible to support tab-navigation like the following pic. example

[arturovt]

@werts

Could you describe the steps which I have to follow to start the application?

• go there, do this, etc.

[werts]

@arturovt

• Including the nginx/prod.conf to your nginx's config

• update the aliases under prod.conf

• bind host micro.apps 127.0.0.1

• visit micro.apps

• root-config is under demo dir.

notice: the import-maps under demo/index.html maybe changed, you should update it yourself. and if you want to update some micro-app , single-spa-inspector helps.

[arturovt]

@werts

I don't have nginx installed. Could you provide a docker config for all of that?

notice: the import-maps under demo/index.html maybe changed, you should update it yourself. and if you want to update some micro-app , single-spa-inspector helps.

Could you please make these changes? Or pre-build those files and push them to git?

[werts]

@arturovt sorry, i dont use docker.

[arturovt]

Sorry, I will not install nginx to run that reproduction. It should be minimal and reproducible :slightly_smiling_face:

[werts]

nginx is not necessarily, i will update it to use http-serve and you need to start all micro-apps,i think it is more hard.

[werts]

@arturovt To test single-spa-angular, i think it is the minimal repo..its simple as https://github.com/joeldenning/coexisting-angular-microfrontends

[arturovt]

@werts we probably misunderstand each other :slightly_smiling_face: . An MRE (minimal reproducible example) is intended to reproduce an error using the smallest amount of code. It saves package developers time in wading through messy code that is not relevant to the apparent bug (description taken from google ;) )

In simple words what I would like to get (as that person who will look at your example, spend time debugging it and possibly come back with a working solution) is to: 1) clone the repo 2) run npm install in app1-app2 3) run npm start in app1-app2 4) apps are running

Steps like: 1) install Nginx, copy nginx/prod.conf into /etc/nginx/... 2) update aliases 3) update /etc/hosts 4) change import maps in index.html

are not acceptable.

Honestly saying, no one will go through such steps :wink:

[Sally-yu]

你好，我也遇到同样的问题，重新挂载app1，存储的复用快照会报错。有什么新进展吗

[arturovt]

Any progress on creating a reproducible example?

[werts]

@arturovt sorry,We have given up using route-reuse-strategy

[arturovt]

@joeldenning can we close this issue due to inactivity? Unfortunately, the complete reproducible example wasn’t provided.

[joeldenning]

Sure let's close