Fix styled-components example README notes #11548

mattcarlotta · 2020-04-01T11:46:00Z

There are mistakes in the notes and workaround example in #11540. The notes and example used an incorrect forwardAs named prop instead of the correct forwardedAs prop provided by styled. Provided in this pull request are updated notes as well as an updated workaround example to correct them.

lfades · 2020-04-01T15:57:29Z

@mattcarlotta Can you fix the conflicts 🙏

ijjk · 2020-04-01T17:05:23Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
buildDuration	10.1s	10.1s	⚠️ +69ms
nodeModulesSize	47.7 MB	47.7 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.js gzip	6.24 kB	6.24 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
de003c3a9d30..c6c1.js gzip	10.1 kB	10.1 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	56.2 kB	56.2 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.module.js gzip	4.78 kB	4.78 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
de003c3a9d30..dule.js gzip	6.71 kB	6.71 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	51.4 kB	51.4 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
polyfills-HASH.js gzip	26.3 kB	26.3 kB	✓
Overall change	26.3 kB	26.3 kB	✓

Client Pages

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.js gzip	1.24 kB	1.24 kB	✓
_error.js gzip	3.15 kB	3.15 kB	✓
hooks.js gzip	664 B	664 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.03 kB	2.03 kB	✓
routerDirect.js gzip	279 B	279 B	✓
withRouter.js gzip	278 B	278 B	✓
Overall change	7.86 kB	7.86 kB	✓

Client Pages Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.module.js gzip	594 B	594 B	✓
_error.module.js gzip	2.08 kB	2.08 kB	✓
hooks.module.js gzip	370 B	370 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	1.48 kB	1.48 kB	✓
routerDirect..dule.js gzip	271 B	271 B	✓
withRouter.m..dule.js gzip	270 B	270 B	✓
Overall change	5.28 kB	5.28 kB	✓

Client Build Manifests

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Rendered Page Sizes

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
index.html gzip	918 B	918 B	✓
link.html gzip	926 B	926 B	✓
withRouter.html gzip	916 B	916 B	✓
Overall change	2.76 kB	2.76 kB	✓

Serverless Mode (Increase detected ⚠️)

General

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
buildDuration	10.6s	10.3s	-230ms
nodeModulesSize	47.7 MB	47.7 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.js gzip	6.24 kB	6.24 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
de003c3a9d30..c6c1.js gzip	10.1 kB	10.1 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	56.2 kB	56.2 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.module.js gzip	4.78 kB	4.78 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
de003c3a9d30..dule.js gzip	6.71 kB	6.71 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	51.4 kB	51.4 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
polyfills-HASH.js gzip	26.3 kB	26.3 kB	✓
Overall change	26.3 kB	26.3 kB	✓

Client Pages

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.js gzip	1.24 kB	1.24 kB	✓
_error.js gzip	3.15 kB	3.15 kB	✓
hooks.js gzip	664 B	664 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.03 kB	2.03 kB	✓
routerDirect.js gzip	279 B	279 B	✓
withRouter.js gzip	278 B	278 B	✓
Overall change	7.86 kB	7.86 kB	✓

Client Pages Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.module.js gzip	594 B	594 B	✓
_error.module.js gzip	2.08 kB	2.08 kB	✓
hooks.module.js gzip	370 B	370 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	1.48 kB	1.48 kB	✓
routerDirect..dule.js gzip	271 B	271 B	✓
withRouter.m..dule.js gzip	270 B	270 B	✓
Overall change	5.28 kB	5.28 kB	✓

Client Build Manifests

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Serverless bundles Overall increase ⚠️

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_error.js gzip	232 kB	232 kB	⚠️ +3 B
404.html gzip	1.32 kB	1.32 kB	✓
hooks.html gzip	959 B	959 B	✓
index.js gzip	232 kB	233 kB	⚠️ +61 B
link.js gzip	243 kB	243 kB	⚠️ +27 B
routerDirect.js gzip	241 kB	241 kB	⚠️ +48 B
withRouter.js gzip	241 kB	241 kB	⚠️ +18 B
Overall change	1.19 MB	1.19 MB	⚠️ +157 B

ijjk · 2020-04-01T17:07:28Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
buildDuration	10.8s	10.3s	-518ms
nodeModulesSize	47.7 MB	47.7 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.js gzip	6.24 kB	6.24 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
de003c3a9d30..c6c1.js gzip	10.1 kB	10.1 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	56.2 kB	56.2 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.module.js gzip	4.78 kB	4.78 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
de003c3a9d30..dule.js gzip	6.71 kB	6.71 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	51.4 kB	51.4 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
polyfills-HASH.js gzip	26.3 kB	26.3 kB	✓
Overall change	26.3 kB	26.3 kB	✓

Client Pages

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.js gzip	1.24 kB	1.24 kB	✓
_error.js gzip	3.15 kB	3.15 kB	✓
hooks.js gzip	664 B	664 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.03 kB	2.03 kB	✓
routerDirect.js gzip	279 B	279 B	✓
withRouter.js gzip	278 B	278 B	✓
Overall change	7.86 kB	7.86 kB	✓

Client Pages Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.module.js gzip	594 B	594 B	✓
_error.module.js gzip	2.08 kB	2.08 kB	✓
hooks.module.js gzip	370 B	370 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	1.48 kB	1.48 kB	✓
routerDirect..dule.js gzip	271 B	271 B	✓
withRouter.m..dule.js gzip	270 B	270 B	✓
Overall change	5.28 kB	5.28 kB	✓

Client Build Manifests

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Rendered Page Sizes

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
index.html gzip	918 B	918 B	✓
link.html gzip	926 B	926 B	✓
withRouter.html gzip	916 B	916 B	✓
Overall change	2.76 kB	2.76 kB	✓

Serverless Mode (Increase detected ⚠️)

General

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
buildDuration	11.2s	11.5s	⚠️ +328ms
nodeModulesSize	47.7 MB	47.7 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.js gzip	6.24 kB	6.24 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
de003c3a9d30..c6c1.js gzip	10.1 kB	10.1 kB	✓
framework.HASH.js gzip	39.1 kB	39.1 kB	✓
Overall change	56.2 kB	56.2 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
main-HASH.module.js gzip	4.78 kB	4.78 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
de003c3a9d30..dule.js gzip	6.71 kB	6.71 kB	✓
framework.HA..dule.js gzip	39.1 kB	39.1 kB	✓
Overall change	51.4 kB	51.4 kB	✓

Legacy Client Bundles (polyfills)

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
polyfills-HASH.js gzip	26.3 kB	26.3 kB	✓
Overall change	26.3 kB	26.3 kB	✓

Client Pages

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.js gzip	1.24 kB	1.24 kB	✓
_error.js gzip	3.15 kB	3.15 kB	✓
hooks.js gzip	664 B	664 B	✓
index.js gzip	222 B	222 B	✓
link.js gzip	2.03 kB	2.03 kB	✓
routerDirect.js gzip	279 B	279 B	✓
withRouter.js gzip	278 B	278 B	✓
Overall change	7.86 kB	7.86 kB	✓

Client Pages Modern

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_app.module.js gzip	594 B	594 B	✓
_error.module.js gzip	2.08 kB	2.08 kB	✓
hooks.module.js gzip	370 B	370 B	✓
index.module.js gzip	212 B	212 B	✓
link.module.js gzip	1.48 kB	1.48 kB	✓
routerDirect..dule.js gzip	271 B	271 B	✓
withRouter.m..dule.js gzip	270 B	270 B	✓
Overall change	5.28 kB	5.28 kB	✓

Client Build Manifests

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_buildManifest.js gzip	61 B	61 B	✓
_buildManife..dule.js gzip	61 B	61 B	✓
Overall change	122 B	122 B	✓

Serverless bundles Overall increase ⚠️

	zeit/next.js canary	mattcarlotta/next.js styled_components	Change
_error.js gzip	232 kB	232 kB	⚠️ +24 B
404.html gzip	1.32 kB	1.32 kB	✓
hooks.html gzip	959 B	959 B	✓
index.js gzip	232 kB	232 kB	⚠️ +181 B
link.js gzip	242 kB	243 kB	⚠️ +484 B
routerDirect.js gzip	241 kB	241 kB	⚠️ +56 B
withRouter.js gzip	240 kB	240 kB	-164 B
Overall change	1.19 MB	1.19 MB	⚠️ +581 B

lfades

Thank you 💯

Matt added 3 commits March 31, 2020 21:41

Add notes to styled-components example README

2d39cc7

Adjust notes to styled-components example README

b156f29

Fix styled-components README notes

25ce494

mattcarlotta requested review from lfades and Timer as code owners April 1, 2020 11:46

mattcarlotta changed the title ~~Fix styled-components README notes~~ Fix styled-components example README notes Apr 1, 2020

Matt Carlotta added 2 commits April 1, 2020 09:58

Merge branch 'canary' into styled_components

5d9f65e

Update README

91f48db

lfades approved these changes Apr 1, 2020

View reviewed changes

lfades merged commit 5db180b into vercel:canary Apr 1, 2020

This was referenced Apr 17, 2020

[Snyk] Upgrade next from 9.3.4 to 9.3.5 anephenix/ui#4

Merged

[Snyk] Upgrade next from 9.3.4 to 9.3.5 yowainwright/Advanced-React#61

Merged

[Snyk] Upgrade next from 9.3.2 to 9.3.5 tuan231195/sportywide-news#3

Closed

vercel locked as resolved and limited conversation to collaborators Jan 31, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix styled-components example README notes #11548

Fix styled-components example README notes #11548

mattcarlotta commented Apr 1, 2020 •

edited

lfades commented Apr 1, 2020

ijjk commented Apr 1, 2020

ijjk commented Apr 1, 2020

lfades left a comment

Fix styled-components example README notes #11548

Fix styled-components example README notes #11548

Conversation

mattcarlotta commented Apr 1, 2020 • edited

lfades commented Apr 1, 2020

ijjk commented Apr 1, 2020

Stats from current PR

ijjk commented Apr 1, 2020

Stats from current PR

lfades left a comment

Choose a reason for hiding this comment

mattcarlotta commented Apr 1, 2020 •

edited