ant-design / ant-design-examples

Use antd in create-next-app
67 stars 38 forks source link

with-nextjs-app-router-inline-style: a <style> tag is rendered outside the <html> tag #26

Closed nekketsuuu closed 1 year ago

nekketsuuu commented 1 year ago

On with-nextjs-app-router-inline-style example, next build produces index.html which contains two <style id="antd">...</style> tags, and one of the tags is located outside of <html>...</html>. Here is the whole output: https://gist.github.com/nekketsuuu/055300c118072ae16121490ce500f801

W3C's Markup Validation Service https://validator.w3.org/#validate_by_input shows a fatal error for this HTML.

スクリーンショット 2023-08-13 12 27 10

I suppose this may be a problem around StyledComponentsRegistry, but I don't know any details at the moment.

I used yarn v3 to install packages, and run yarn build && yarn start to examine index.html. My yarn.lock is here: https://gist.github.com/nekketsuuu/055300c118072ae16121490ce500f801.

camcam2605 commented 1 year ago

I still have the same issue with you. Can you open this issue at ant-design repo?

nekketsuuu commented 1 year ago

Oh, sorry I don't receive notification for "Can you open~".

It seems that https://github.com/ant-design/ant-design-examples/pull/27 solves this problem now. I cannot reproduce the same problem using the current HEAD. I'm closing this issue. Thank you @zombieJ!

camcam2605 commented 1 year ago

@nekketsuuu This PR does not solve the problem, it only fixed SSR cache bug that crashes the app, currently the problem you are discussing still exists.

nekketsuuu commented 1 year ago

Hmm. For now I cannot reproduce the problem on my local environment.... Would you please open a new issue if you can reproduce the problem?

camcam2605 commented 1 year ago

@nekketsuuu yes, I will do it if I have free time. 😊