[Bug] Build failure when importing useInsertionEffect in React <18 despite fallback to useLayoutEffect

[devarshiqm]

Description

When attempting to use useInsertionEffect with a fallback to useLayoutEffect for backward compatibility with React 16/17, the application fails at build time in environments where useInsertionEffect is not exported (React <18).

Expected behavior:
The fallback (useInsertionEffect ?? useLayoutEffect) should allow the code to run safely across React versions.

Actual behavior:
The application fails during module resolution with an error similar to:

Attempted import error: 'useInsertionEffect' is not exported from 'react'

This happens even though a runtime fallback is provided.

Steps to Reproduce

Use a project configured with React 16 or React 17.
Add the following code:

import { useInsertionEffect, useLayoutEffect } from 'react';

const useBeforeEffect = useInsertionEffect ?? useLayoutEffect;

Build or start the application.
Observe that the build fails with a missing export error.

Environment

• Library version: v1.8.1
• Google maps version: v1.8.1
• Browser and Version: (any, not relevant — failure occurs at build time)
• OS: Mac OS

Logs

This issue arises due to static analysis of ES module imports, where named imports must exist at build time. A safer pattern that works across versions is:

import * as React from 'react';

const useBeforeEffect =
  React.useInsertionEffect ?? React.useLayoutEffect;

This avoids build-time failures by deferring resolution to runtime.

[usefulthink]

Thanks for reporting this. Which tooling are you using that shows this error? I've tested with vite + react 17 and didn't see any problems, apparently because importing a symbol that isn't exported should be undefined.

We'll fix it either way, but I would love to be able to reproduce it first.