vuepress-reco / vuepress-theme-reco

🎨 This is the repo for vuepress-theme-reco 2.
https://vuepress-theme-reco.recoluan.com
MIT License
538 stars 173 forks source link

Giscus Comment Component theme bug with personal solution #198

Closed yxzlwz closed 1 year ago

yxzlwz commented 1 year ago

version: 2.0.0-beta.63

I'm using Giscus as my comment component. It works well with dev server, but when I build it, the theme of the component fallback to High Contrast one, as Tritanopia was expected.

I checked the css file output into dist/assets, only to find .bulletin-wrapper{border-w in both .vuepress\dist\assets\giscus-theme.css and .vuepress\dist\assets\giscus-theme-dark.css.

image

I thought there should be some css content, so I copied content from node_modules\@vuepress-reco\vuepress-plugin-comments\lib\client\styles\giscus-theme.css to those files and restarted the browser, finding the problem was solved. Then I checked the source code, in my opnion, the below program didn't write correct content into those files.

https://github.com/vuepress-reco/vuepress-theme-reco/blob/main/packages/%40vuepress-reco/plugin-comments/src/node/commentsPlugin.ts#L11

As I'm not a skilled frontend developer, I opened this issue. Hope you can fix it ASAP!


Picture: a same page shows in different way in dev and prod version.

image

image

recoluan commented 1 year ago

It was resolved in this commit.

yxzlwz commented 1 year ago

Could you please tell me when a new version will be published on npm?

recoluan commented 1 year ago

Could you please tell me when a new version will be published on npm?

I will release it on Sunday.

yxzlwz commented 1 year ago

I tried to build it locally and the problem fixed. Thank you for answering! I'm looking forward to try the new version tomorrow!

yxzlwz commented 1 year ago

By the way there's another issue: Though my site theme is dark, Giscus always show light theme at the first time I open a certain page. If I refresh the page, Giscus theme will show rightly(match the site theme). But after I open another page and then go back here, Giscus shows light theme again. If I stand in page and change the site theme, Giscus theme can change well.

I tried the latest commit, the problem still occurs.

You can test this problem at my website (I won't update it until the mentioned question fixed), here's the screenshot:

image

yxzlwz commented 1 year ago

image

These code can fix it, which is really not elegant...

yxzlwz commented 1 year ago

I found that the problem was occured because class nprogress-busy will be added to html class when changing page, so that compare string can't work correctly. I opened a PR to fix this problem.

Please merge it before your publishing tomorrow, as I'm really looking forward to deploy my blog! Thx.

yxzlwz commented 1 year ago

Will I be able to see new published version tonight?

yxzlwz commented 1 year ago

Still no new version now...

yxzlwz commented 1 year ago

Fine, I'm going to build it myself