Material-UI not working when using npm link

Viewed 179

I created a shared-components repo which contains wrapped Material-UI components and are packaged as an NPM module.

The module works fine when installed via the remote package: npm install *name-of-package*, but when I npm link so I can develop locally it crashes saying the theme variables I define are undefined.

Here is my main repo's code:

import { ThemeProvider } from '@mui/material';
import { theme, Button } from 'my-shared-components'; // npm-link'd repo

...

<ThemeProvider theme={theme}>
  <Button>Click</Button>.       // crash occurs here saying a theme color is undefined
</ThemeProvider>

package.json

dependencies: {
    "@mui/material": "^5.0.0-rc.0",
    "@mui/styled-engine": "npm:@mui/styled-engine-sc@next",
    "@mui/styled-engine-sc": "^5.0.0-rc.0",
    ...
}

Shared-Component repo code:

import { createTheme } from '@mui/material/styles';

...

export default createTheme(themeObj);

package.json

"peerDependencies": {
  "@mui/material": "^5.0.0-rc.0",
  "@mui/styled-engine-sc": "^5.0.0-rc.0",
  "@mui/styled-engine": "npm:@mui/styled-engine-sc@next",
  ...
}

Does anyone know why this would work when I do npm install but not when I npm link? Thanks!

0 Answers
Related