Client hydration not working?

[cskiwi]

I was wondering how does the client hydration works, or how to enable it.

When starting from my other issues repo: https://github.com/cskiwi/herring-gull-angular

If you have a look at the welcome.component.ts you can see that I have a @defer in my code, but this is never resolved.

From what I can gather is that the clientHydration is never done, but I can't put it anywere to enable this. Looking at the source code, it should be doing the hydration. but it doesn't

[nitedani]

Seems to work fine for me: https://github.com/nitedani/vite-plugin-angular/blob/main/examples/universal/src/app/app.component.html

[nitedani]

I see the issue

[nitedani]

I fixed a few things in the plugin, and updated your example to make it work https://github.com/nitedani/herring-gull-angular

[nitedani]

The Angular is running in development mode spam is caused by https://github.com/nitedani/vite-plugin-angular/blob/c320254f77f822d91933f446c9c6ed4371a5c35d/packages/vite-plugin-angular/src/plugin/plugins/swc.plugin.ts#L81C9-L81C9

I should fix this later

[cskiwi]

Thanks for the fix! However, this doesn't work if you would build the project and then run node apps/gull/dist/server/index.js.

However I can start developing something already which is nice :)

[nitedani]

The issue with build is that my plugin loads the wrong tsconfig.json, or something tsconfig related, and in turn excludes too many source files from the client bundle. I'll look into it later.

[cskiwi]

Alright, let me know if I have to test something :)

btw loving the work you are doing! Look at the page speed insights, and this is with angular material so not a light framework. Of course the hydration isn't working. but still it loads the static page very fast :P

[nitedani]

I fixed build on https://github.com/nitedani/herring-gull-angular, npm run build -> cd apps/gull -> node dist/server The issue was:

1. the tsconfig didn't include some files
2. compilerOptions.paths is treated relative to the apps/gull folder, not the repo root. I added the path in apps/gull/tsconfig.json manually to make it work, I'll see what I can do so this isn't required

[cskiwi]

@nitedani thanks for finding this!

From what I can tell is that it just won't work with the tsconfig.app.json format. because if you just move the "include": ["src/**/*"], to the tsconfig.app.json. it fails.

So this would tell me that it only loads the tsconfig.json an not the references.