Open Vercjames opened 1 year ago
When trying to use Material UI I am graced with the following error: styled_default is not a function.
derived from this code segment in MUI
createStyledComponent: styled_default("div", { name: "MuiGrid2", slot: "Root", overridesResolver: (props, styles) => styles.root }),
yarn add @mui/material @emotion/react @emotion/styled yarn add @mui/material @mui/styled-engine-sc styled-components
yarn add @mui/material @emotion/react @emotion/styled
yarn add @mui/material @mui/styled-engine-sc styled-components
import React from "react" import Grid from "@mui/material/Unstable_Grid2/Grid2" import { Grid2Props } from "@mui/material/Unstable_Grid2/Grid2Props"
export const MyGrid = ({ children, ...rest }: AUIGridProps) => { return (
) }
interface AUIGridProps extends Grid2Props { children: React.ReactNode; }
### System ```shell System: OS: macOS 13.4.1 CPU: (12) arm64 Apple M2 Max Binaries: Node: 20.5.0 - ~/.nvm/versions/node/v20.5.0/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v20.5.0/bin/yarn npm: 9.8.1 - ~/.nvm/versions/node/v20.5.0/bin/npm Browsers: Chrome: 115.0.5790.114 Safari: 16.5.2 npmPackages: @storybook/addon-a11y: 7.2.0 => 7.2.0 @storybook/addon-docs: ^7.2.0 => 7.2.0 @storybook/addon-essentials: 7.2.0 => 7.2.0 @storybook/addon-interactions: 7.2.0 => 7.2.0 @storybook/addon-links: 7.2.0 => 7.2.0 @storybook/addon-mdx-gfm: 7.2.0 => 7.2.0 @storybook/addon-storyshots: 7.2.0 => 7.2.0 @storybook/addon-styling: ^1.3.5 => 1.3.5 @storybook/addons: 7.2.0 => 7.2.0 @storybook/blocks: 7.2.0 => 7.2.0 @storybook/react: 7.2.0 => 7.2.0 @storybook/react-vite: 7.2.0 => 7.2.0 @storybook/storybook-deployer: ^2.8.16 => 2.8.16 @storybook/testing-library: 0.2.0 => 0.2.0
Still a problem using v7.6.7
Hey @Vercjames 👋
Can you share a reproduction of your issue to help me dig in?
yarn vite --force
Forced re-optimization of dependencies
👍🏻
Describe the bug
When trying to use Material UI I am graced with the following error: styled_default is not a function.
derived from this code segment in MUI
createStyledComponent: styled_default("div", { name: "MuiGrid2", slot: "Root", overridesResolver: (props, styles) => styles.root }),
To Reproduce
yarn add @mui/material @emotion/react @emotion/styled
yarn add @mui/material @mui/styled-engine-sc styled-components
export const MyGrid = ({ children, ...rest }: AUIGridProps) => { return (
) }
interface AUIGridProps extends Grid2Props { children: React.ReactNode; }
Additional context