Verify canary release
Provide environment information
Operating System:
Platform: linux
Arch: x64
Version: #1 SMP Fri Apr 2 22:23:49 UTC 2021
Binaries:
Node: 18.12.0
npm: 8.19.2
Yarn: 1.22.17
pnpm: N/A
Relevant packages:
next: 13.0.3
eslint-config-next: 13.0.1
react: 18.2.0
react-dom: 18.2.0
What browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
No response
Describe the Bug
Whenever a new component loads, it overrides any custom styling on that component.
For example lets say I have a Link component that has color: gray and I've used it in header but because header is gray itself, I've added a custom styling for that link as color: white.
Now imagine I have another page that uses same Link component but with default styles this time (color: gray)
Open the app's home page (which does not have any link inside, only in header), everything fine, navigate to the other page that is using Link component, header color breaks because the default style of the Link component loads again and replaces custom color set for header Link
Expected Behavior
Think it's obvious but just to fill in:
The ideal behavior is not to refetch Link component's styles when it's already loaded
Another bad but still better behavior would be to load it but not override custom styles of Link in header
Link to reproduction - Issues with a link to complete (but minimal) reproduction code will be addressed faster
Reproduction Live (stackblitz) Link

To Reproduce
Explained enough in Describe the Bug section, together with the reproduction link it should be enough to reproduce
Verify canary release
Provide environment information
Operating System:
Platform: linux
Arch: x64
Version: #1 SMP Fri Apr 2 22:23:49 UTC 2021
Binaries:
Node: 18.12.0
npm: 8.19.2
Yarn: 1.22.17
pnpm: N/A
Relevant packages:
next: 13.0.3
eslint-config-next: 13.0.1
react: 18.2.0
react-dom: 18.2.0
What browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
No response
Describe the Bug
Whenever a new component loads, it overrides any custom styling on that component.
For example lets say I have a Link component that has
color: grayand I've used it in header but because header is gray itself, I've added a custom styling for that link ascolor: white.Now imagine I have another page that uses same Link component but with default styles this time (
color: gray)Open the app's home page (which does not have any link inside, only in header), everything fine, navigate to the other page that is using Link component, header color breaks because the default style of the Link component loads again and replaces custom color set for header Link
Expected Behavior
Think it's obvious but just to fill in:
The ideal behavior is not to refetch Link component's styles when it's already loaded
Another bad but still better behavior would be to load it but not override custom styles of Link in header
Link to reproduction - Issues with a link to complete (but minimal) reproduction code will be addressed faster
Reproduction Live (stackblitz) Link
To Reproduce
Explained enough in Describe the Bug section, together with the reproduction link it should be enough to reproduce