The transformHtml modification to the sideBar code is not taking effect.

[Justin3go]

Background

I want to implement single-line ellipsis display in the sidebar, and show the title when the mouse hovers over it, like this:

The current solution I have in mind is to use the transformHtml function to modify the generated HTML code, adding the appropriate title to the corresponding sidebar.

I accomplished this task through simple regex replacement.

Question

It is evident that the build artifacts in the dist directory have been modified, but when I run pnpm docs:preview, the corresponding title attribute is not present.

I want to know why the build artifacts are correct, but the output is not as expected when running. Is there any difference between the two?

Relevant links

• Online DEMO
• Source Code

[brc-dd]

Patch the component. Using transformHtml to tweak things inside the app element will break hydration.

[Justin3go]

Thank you for your response.