Make sure not to require react before NODE_ENV has been set

[ijjk]

If NODE_ENV is undefined when we require react it defaults to the development bundle which breaks next start since once it's required it is cached.

Fixes: #7167
Fixes: #7082
Closes: #7190

[github-actions]

Stats from current PR

Click to expand stats

	zeit/next.js canary	ijjk/next.js fix/mismatched-react	Change
Build Duration	12.7s	12.9s	⚠️ +248ms
node_modules Size	39.6 MB	39.6 MB	⚠️ +285 B
Total Bundle (main, webpack, commons) Size	207 kB	207 kB	✓
Total Bundle (main, webpack, commons) gzip Size	68.2 kB	68.2 kB	✓
Client _app Size	2.13 kB	2.13 kB	✓
Client _app gzip Size	919 B	919 B	✓
Client _error Size	14.2 kB	14.2 kB	✓
Client _error gzip Size	5.39 kB	5.39 kB	✓
Client pages/index Size	288 B	288 B	✓
Client pages/index gzip Size	222 B	222 B	✓
Client pages/link Size	3.62 kB	3.62 kB	✓
Client pages/link gzip Size	1.63 kB	1.63 kB	✓
Client pages/routerDirect Size	411 B	411 B	✓
Client pages/routerDirect gzip Size	296 B	296 B	✓
Client pages/withRouter Size	393 B	393 B	✓
Client pages/withRouter gzip Size	280 B	280 B	✓
Client main Size	27.9 kB	27.9 kB	✓
Client main gzip Size	9.64 kB	9.64 kB	✓
Client commons Size	177 kB	177 kB	✓
Client commons gzip Size	57.4 kB	57.4 kB	✓
Client webpack Size	1.49 kB	1.49 kB	✓
Client webpack gzip Size	769 B	769 B	✓
Base Rendered Size	1.34 kB	1.34 kB	✓
Build Dir Size	637 kB	637 kB	✓

Click to expand serverless stats

	zeit/next.js canary	ijjk/next.js fix/mismatched-react	Change
Build Duration	14.6s	14.5s	-123ms
node_modules Size	39.6 MB	39.6 MB	⚠️ +285 B
Total Bundle (main, webpack, commons) Size	207 kB	207 kB	✓
Total Bundle (main, webpack, commons) gzip Size	68.2 kB	68.2 kB	✓
Client _app Size	2.13 kB	2.13 kB	✓
Client _app gzip Size	919 B	919 B	✓
Client _error Size	14.2 kB	14.2 kB	✓
Client _error gzip Size	5.39 kB	5.39 kB	✓
Client pages/index Size	288 B	288 B	✓
Client pages/index gzip Size	222 B	222 B	✓
Client pages/link Size	3.62 kB	3.62 kB	✓
Client pages/link gzip Size	1.63 kB	1.63 kB	✓
Client pages/routerDirect Size	411 B	411 B	✓
Client pages/routerDirect gzip Size	296 B	296 B	✓
Client pages/withRouter Size	393 B	393 B	✓
Client pages/withRouter gzip Size	280 B	280 B	✓
Client main Size	27.9 kB	27.9 kB	✓
Client main gzip Size	9.64 kB	9.64 kB	✓
Client commons Size	177 kB	177 kB	✓
Client commons gzip Size	57.4 kB	57.4 kB	✓
Client webpack Size	1.49 kB	1.49 kB	✓
Client webpack gzip Size	769 B	769 B	✓
Serverless pages/link Size	327 kB	327 kB	✓
Serverless pages/link gzip Size	87.5 kB	87.5 kB	⚠️ +1 B
Serverless pages/index Size	321 kB	321 kB	✓
Serverless pages/index gzip Size	85.6 kB	85.6 kB	✓
Serverless pages/_error Size	322 kB	322 kB	✓
Serverless pages/_error gzip Size	85.3 kB	85.3 kB	⚠️ +1 B
Serverless pages/routerDirect Size	321 kB	321 kB	✓
Serverless pages/routerDirect gzip Size	85.6 kB	85.6 kB	⚠️ +1 B
Serverless pages/withRouter Size	321 kB	321 kB	✓
Serverless pages/withRouter gzip Size	85.7 kB	85.7 kB	-1 B
Build Dir Size	2.19 MB	2.19 MB	✓

[github-actions]

Stats from current PR

Click to expand stats

	zeit/next.js canary	ijjk/next.js fix/mismatched-react	Change
Build Duration	13.2s	13.1s	-146ms
node_modules Size	39.6 MB	39.6 MB	⚠️ +285 B
Total Bundle (main, webpack, commons) Size	207 kB	207 kB	✓
Total Bundle (main, webpack, commons) gzip Size	68.2 kB	68.2 kB	✓
Client _app Size	2.13 kB	2.13 kB	✓
Client _app gzip Size	919 B	919 B	✓
Client _error Size	14.2 kB	14.2 kB	✓
Client _error gzip Size	5.39 kB	5.39 kB	✓
Client pages/index Size	288 B	288 B	✓
Client pages/index gzip Size	222 B	222 B	✓
Client pages/link Size	3.62 kB	3.62 kB	✓
Client pages/link gzip Size	1.63 kB	1.63 kB	✓
Client pages/routerDirect Size	411 B	411 B	✓
Client pages/routerDirect gzip Size	296 B	296 B	✓
Client pages/withRouter Size	393 B	393 B	✓
Client pages/withRouter gzip Size	280 B	280 B	✓
Client main Size	27.9 kB	27.9 kB	✓
Client main gzip Size	9.64 kB	9.64 kB	✓
Client commons Size	177 kB	177 kB	✓
Client commons gzip Size	57.4 kB	57.4 kB	✓
Client webpack Size	1.49 kB	1.49 kB	✓
Client webpack gzip Size	769 B	769 B	✓
Base Rendered Size	1.34 kB	1.34 kB	✓
Build Dir Size	637 kB	637 kB	✓

Click to expand serverless stats

	zeit/next.js canary	ijjk/next.js fix/mismatched-react	Change
Build Duration	15.3s	15.4s	⚠️ +113ms
node_modules Size	39.6 MB	39.6 MB	⚠️ +285 B
Total Bundle (main, webpack, commons) Size	207 kB	207 kB	✓
Total Bundle (main, webpack, commons) gzip Size	68.2 kB	68.2 kB	✓
Client _app Size	2.13 kB	2.13 kB	✓
Client _app gzip Size	919 B	919 B	✓
Client _error Size	14.2 kB	14.2 kB	✓
Client _error gzip Size	5.39 kB	5.39 kB	✓
Client pages/index Size	288 B	288 B	✓
Client pages/index gzip Size	222 B	222 B	✓
Client pages/link Size	3.62 kB	3.62 kB	✓
Client pages/link gzip Size	1.63 kB	1.63 kB	✓
Client pages/routerDirect Size	411 B	411 B	✓
Client pages/routerDirect gzip Size	296 B	296 B	✓
Client pages/withRouter Size	393 B	393 B	✓
Client pages/withRouter gzip Size	280 B	280 B	✓
Client main Size	27.9 kB	27.9 kB	✓
Client main gzip Size	9.64 kB	9.64 kB	✓
Client commons Size	177 kB	177 kB	✓
Client commons gzip Size	57.4 kB	57.4 kB	✓
Client webpack Size	1.49 kB	1.49 kB	✓
Client webpack gzip Size	769 B	769 B	✓
Serverless pages/link Size	327 kB	327 kB	✓
Serverless pages/link gzip Size	87.5 kB	87.5 kB	-2 B
Serverless pages/index Size	321 kB	321 kB	✓
Serverless pages/index gzip Size	85.6 kB	85.6 kB	✓
Serverless pages/_error Size	322 kB	322 kB	✓
Serverless pages/_error gzip Size	85.3 kB	85.3 kB	-1 B
Serverless pages/routerDirect Size	321 kB	321 kB	✓
Serverless pages/routerDirect gzip Size	85.6 kB	85.6 kB	-1 B
Serverless pages/withRouter Size	321 kB	321 kB	✓
Serverless pages/withRouter gzip Size	85.7 kB	85.7 kB	✓
Build Dir Size	2.19 MB	2.19 MB	✓

[nblthree]

Closes #7082 too

[oliviertassinari]

Awesome :D