I met following warning message after invoking create-next-app for ` example/with-typescript-eslint-jest `:
```
% yarn dev
yarn run v1.22.10
$ next dev
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
warn - React 17.0.1 or newer will be required to leverage all of the upcoming features in Next.js 11. Read more: https://err.sh/next.js/react-version
event - compiled successfully
```
I have followed the instructions in the link, and this patch is. Please merge this.
Thank you for reading.
This implements the compatibility require hook as per https://github.com/vercel/next.js/issues/21789.
The hook is applied at the point of webpack initialization. In addition the separate packages are exposed for the various webpack subrequires.
The test then ensures instance equality for the basic require hook from the next.js config file.
I suspect this might have bad interactions with Yarn Pnp support, but maybe we will be lucky.
This should resolve the typing issues described in https://github.com/vercel/next.js/issues/21390 from the webpack inlining, by declaring `next/dist/compiled/webpack` in the main typing file as a source.
My addition of the Yarn 2 caveat was more nuanced than I thought. Apologies. @merceyz has been adding extensive e2e tests for Yarn 2 support. We plan to support Yarn 2 compat.
Reverts https://github.com/vercel/next.js/pull/21657.
@timneutkens I think this is ready for a review.
I've made some changes to the original design that _seem_ to have paid off. The parenting relationships for traces of normal builds are applied more uniformly, resulting in more intelligible traces:
<img width="900" alt="Screen Shot 2021-01-29 at 12 53 47 AM" src="https://user-images.githubusercontent.com/5016978/106253732-ba321880-61cc-11eb-98fd-d45af5078273.png">
Hot-reloading is surfaced now, too. I will note, however, that we will want to dig in deeper and find out where the large portion of time at the beginning of hot-reload is spent. Example:
<img width="894" alt="Screen Shot 2021-01-29 at 12 53 28 AM" src="https://user-images.githubusercontent.com/5016978/106253828-e057b880-61cc-11eb-967d-46eaff31ecef.png">
Where did those 180 ms go? At the least, we can now track how long a hot-reload takes, and have a place to start with further investigation.
This insures we add entries for each locale version of a non-dynamic SSG page since they can have unique revalidate values. This requires a version bump in the `prerender-manifest` since the static routes now contain additional values which need to be handled separately.
Fixes: https://github.com/vercel/next.js/issues/21568
I tried the preset provided at `packages/next-plugin-storybook` but it was raising error due to an [unsafe negation](https://eslint.org/docs/rules/no-unsafe-negation) in the `preset.js` file.
I added a test to show the error:
```
● next-plugin-storybook filterModuleRules › should filter module rules correctly
TypeError: rule.test.test is not a function
48 | if (!rule.test instanceof RegExp) return true
49 | // use Next.js' built-in CSS
> 50 | if (rule.test.test('hello.css')) {
| ^
51 | return false
52 | }
53 | // use next-babel-loader instead of storybook's babel-loader
at filter (../packages/next-plugin-storybook/preset.js:50:21)
at Array.filter (<anonymous>)
at Object.filterModuleRules (../packages/next-plugin-storybook/preset.js:46:28)
at Object.<anonymous> (unit/webpack-config-overrides.test.js:12:36)
```
