material-ui: Module not found @material-ui/core/ThemeProvider when minimizing bundle size in create react app
- The issue is present in the latest release.
- I have searched the issues of this repository and believe that this is not a duplicate.
Current Behavior 😯
I get
Module not found: Can't resolve '@material-ui/core/ThemeProvider'
Expected Behavior 🤔
I don’t expect any errors.
Steps to Reproduce 🕹
Since this is a bug related to the project setup then I can’t make a codesandbox for it
Steps:
- npx create-react-app my_app --template typescript
- install material core
5.0.0-alpha.13 npm add -D babel-plugin-transform-imports react-app-rewired customize-cra- Update
package.jsonand create.babelrc.js,config-overrides.jsfiles as outlined in the docs. - create source content as in this example.
Context 🔦
Your Environment 🌎
| Tech | Version |
|---|---|
| Material-UI | v5.0.0-alpha.13 |
| React | v16.14.0 |
| Browser | |
| TypeScript | v4.0.3 |
| etc. |
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Comments: 18 (18 by maintainers)
@eps1lon From what I understand, the tweet mentions that there are a few modules that need an exception because they don’t follow the folder convention (
import x from '@material-ui/core/x'). The relevant link from the gist the tweet has: https://gist.github.com/developit/037baaec2a0a1e64e628c84fdd5c1107#file-babel-plugin-transform-mui-imports-js-L19I suggest using option 1 only for @material-ui/icons only where it has the biggest benefit. Anything not using babel plugins should be safe regardless.
Nevermind, I think I know what’s happening. We changed the bundle layout and this section is now outdated.