build: import useSyncExternalStore from react when using react 18 (#3…

…7212)

Fixes #37197 

tested with `examples/analyze-bundles/`, stripped off 300b of the the use-sync-external-store shim when applied the code change. 

## Bug

- [x] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

packages/next/shared/lib/loadable.js

@@ -22,10 +22,12 @@ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
 // Modified to be compatible with webpack 4 / Next.js
 
 import React from 'react'
-import { useSyncExternalStore } from 'use-sync-external-store/shim'
-
 import { LoadableContext } from './loadable-context'
 
+const { useSyncExternalStore } = process.env.__NEXT_REACT_ROOT
+  ? require('react')
+  : require('use-sync-external-store/shim')
+
 const ALL_INITIALIZERS = []
 const READY_INITIALIZERS = []
 let initialized = false