Introducing ReUI:Open-source UI components and apps built with React, Next.js and Tailwind CSS
Browse ReUI

Blazor 8.2.9 StarterKit and routing prerendering


I noticed that in the StarterKit 8.2.9 sample project there is support for .net 8. Great news! Thank you! happy
I also tried it with .net 9 and it works fine, however pages that have paths at more than one level are not displayed.
It also happens in the StarterKit, for example for the "/dashboards/delivery" page.
Using a single level, like "/signin" this works.

This is causing this problem by setting the rendermode for the Routes object in App.razor
<Routes rendermode="new InteractiveServerRenderMode(prerender: false)" />

Setting prerender to true do solve this problem.


This is not a real question, just let you know.
Is there a specific reason for setting prerender: false? Performance?


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (5)

Deleted comment

Sorry, I was wrong.
The starterkit project does not work correctly in the use of paths.

By setting the prerendering, the page is correctly displayed, but it does not work, because the call to the blazor script takes the wrong path.
This happens if you enter the page directly, without navigating through the links.

<script src="_framework/blazor.web.js"></script>

gets a relative path and does not find _framework



Maybe I found a solution.
In my opinion you should alter the App.razor file adding
<base href="/" />
in the head html
and change false to true for Routes prerender
<Routes @rendermode="new InteractiveServerRenderMode(prerender: true)" />



Hi,

Sorry for the late reply.

If your server uses relative paths, adding <base href="/" /> should resolve the issue.

The prerender: true setting determines the render mode. When set to true, your component will be prerendered on the server. However, both prerender: true and prerender: false should function correctly depending on your use case.

Did you encounter any errors when setting prerender to false?

Regards,
Lauris Stepanovs,
Keenthemes Support Team



yes I did.
When I try to open /dashboards/delivery it is blank.
The component corresponding to
@page "/dashboards/delivery"
is not rendered.

So I choose to set it to true.
I'm using .net 9, I did non test with 8.

Thank you!



Hi,

Thank you for your feedback.

We will investigate this further and if there is an issue related to our codebase we will fix it in the next Metronic release.

Regards,
Lauris Stepanovs,
Keenthemes Support Team


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(