How are the components exported?

Viewed 32

I know that you are exporting components in a way that when the consumer wants to import it in some project, h/she can import like import Button from '@mui/material/Button'; Here only the code for Button will be downloaded and not the whole library. May I know how have achieved this? I have my style guide and when I try to import just a Button, the entire library gets imported and hence the bundle size of 1.8 MB gets downloaded unnecessarily. I want to export the components in my library in a way that when I import a component, only that particular component's code should be downloaded

1 Answers

I think you are talking about peer dependency. Specify that library in package.json in your library. So the app where you will use your library will rely on library you already have in your project.

Your own private lib:

"name": "my-lib",
"version": "1.0.0",
"peerDependencies": {
  "@material-ui/core": "^4.12.3",
  "@material-ui/icons": "^4.11.2",
  "@material-ui/styles": "^4.11.3",
  "react": "^17.0.2"
},
Related