How do I get consistency across package dependencies? The ?deps= query parameter doesn't seem to do it deep enough.

[shawncrawley]

I keep running into cases where the ?deps= query parameter is yielding inconsistencies. I cannot figure out how to appropriately solve this.

My current example is: https://esm.sh/@mui/material?deps=react@18.2.0

One of the imports in the resulting content is https://esm.sh/v135/@mui/system@5.16.7/es2022/DefaultPropsProvider.js, which itself imports react@18.3.1.

I then tried just using react@18.3.1 via https://esm.sh/@mui/material?deps=react@18.3.1, and this ended up with the reverse issue: one of the deeper imports was importing react@18.2.0.

In either case, I end up with my script failing in the browser with TypeError: Cannot read properties of null (reading 'useContext'), which of course comes from the mismatching versions of react being used.

Any help here would be appreciated, as I've poured many hours into trying to figure this out myself. I will add that I'm trying to support quite dynamic stuff, so I'm trying to avoid building these packages and storing the code myself. But I'll of course accept reality if that's my only option.

Let me know what I'm missing, if anything. Thank you!

[ije]

I believe this issue has been fixed in v136, but it is not yet deployed online (check #856)

[ije]

here is the dev version of https://esm.sh/@mui/material?deps=react@18.2.0,react-dom@18.2.0, on the main branch:

/* esm.sh - @mui/material@5.16.7 */
import "/@mui/system@^5.16.7/DefaultPropsProvider?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/RtlProvider?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/Unstable_Grid?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/colorManipulator?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/createStyled?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/createTheme?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/styleFunctionSx?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/useMediaQuery?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/useThemeProps?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7/useThemeWithoutDefault?deps=react@18.2.0&target=es2024";
import "/@mui/system@^5.16.7?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/appendOwnerState?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/capitalize?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/clamp?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/composeClasses?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/createChainedFunction?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/debounce?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/deepmerge?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/deprecatedPropType?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/extractEventHandlers?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/formatMuiErrorMessage?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/generateUtilityClass?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/generateUtilityClasses?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/getScrollbarSize?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/getValidReactChildren?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/isHostComponent?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/isMuiElement?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/mergeSlotProps?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/ownerDocument?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/ownerWindow?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/requirePropFactory?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/resolveComponentProps?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/resolveProps?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/setRef?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/unsupportedProp?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useControlled?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useEnhancedEffect?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useEventCallback?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useForkRef?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useId?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useIsFocusVisible?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/usePreviousProps?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useSlotProps?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/useTimeout?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6/visuallyHidden?deps=react@18.2.0&target=es2024";
import "/@mui/utils@^5.16.6?deps=react@18.2.0&target=es2024";
import "/@popperjs/core@^2.11.8?target=es2024";
import "/clsx@^2.1.0?target=es2024";
import "/react-dom@18.2.0/es2024/react-dom.mjs";
import "/react-transition-group@^4.4.5?deps=react-dom@18.2.0,react@18.2.0&target=es2024";
import "/react@18.2.0/es2024/jsx-runtime.js";
import "/react@18.2.0/es2024/react.mjs";
export * from "/@mui/material@5.16.7/X-ZHJlYWN0LWRvbUAxOC4yLjAscmVhY3RAMTguMi4w/es2024/material.mjs";