Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[icons] Not able to use @mui/icons-material imports - module not found #38530

Closed
2 tasks done
jinsley8 opened this issue Aug 17, 2023 · 3 comments
Closed
2 tasks done
Labels
package: icons Specific to @mui/icons

Comments

@jinsley8
Copy link

jinsley8 commented Aug 17, 2023

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Steps to reproduce 🕹

Link to live example:
https://codesandbox.io/sandbox/mui-page-layout-w8rp6q

It works on codesandbox but if I download the sandbox and install locally I get module not found errors when importing icons.

I'm having this same issue with a large project using mui v5 as well. it's can't find the icon imports.

Even if I clone this project example I am getting the same error importing any icon like import AccountCircleOutlinedIcon from "@mui/icons-material/AccountCircleOutlined";

Steps:

  1. Go to /about page in Codesandbox
  2. Download sandbox, run locally, and I get module not found errors when importing icon on /about page

Current behavior 😯

Locally, I am getting errors like Module not found: Can't resolve '@mui/icons-material/AccountCircleOutlined' when trying to import icons.

Expected behavior 🤔

Should be able to import without any issues.

Context 🔦

Just trying to import icons. Could this be an issue with swc vs webpack in Next.js? Any ideas what could cause this if it is a local issue? It was working fine last week.

Your environment 🌎

npx @mui/envinfo
  System:
    OS: macOS 13.5
  Binaries:
    Node: 20.5.0 - /opt/homebrew/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 9.8.0 - /opt/homebrew/bin/npm
  Browsers:
    Chrome: 115.0.5790.170
    Edge: 114.0.1823.51
    Safari: 16.6
  npmPackages:
    @emotion/react: ^11.11.1 => 11.11.1
    @emotion/styled: ^11.11.0 => 11.11.0
    @mui/base:  5.0.0-beta.11
    @mui/core-downloads-tracker:  5.14.5
    @mui/icons-material: ^5.14.3 => 5.14.3
    @mui/lab: ^5.0.0-alpha.140 => 5.0.0-alpha.140
    @mui/material: ^5.14.5 => 5.14.5
    @mui/private-theming:  5.14.5
    @mui/styled-engine:  5.13.2
    @mui/styles: ^5.14.5 => 5.14.5
    @mui/system:  5.14.5
    @mui/types:  7.2.4
    @mui/utils:  5.14.5
    @mui/x-data-grid: ^6.11.2 => 6.11.2
    @types/react: ^18.2.20 => 18.2.20
    react: 18.2.0 => 18.2.0
    react-dom: 18.2.0 => 18.2.0
    typescript: ^5.1.6 => 5.1.6
@jinsley8 jinsley8 added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Aug 17, 2023
@jinsley8
Copy link
Author

Appears to be an issue with @mui/icons-material as version 5.14.1 works but 5.14.3 does not.

@ZeeshanTamboli
Copy link
Member

ZeeshanTamboli commented Sep 20, 2023

@jinsley8 The CodeSandbox you mentioned isn't working.

So, I opened this example in the CodeSandbox, downloaded the sandbox and ran it locally but I am not getting the error when I imported import AccountCircleOutlinedIcon from '@mui/icons-material/AccountCircleOutlined'; in the /about page.

Could you try it again with the latest icons-material version?

@ZeeshanTamboli ZeeshanTamboli added status: waiting for author Issue with insufficient information and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Sep 20, 2023
@jinsley8
Copy link
Author

@ZeeshanTamboli the issue was fixed in 5.14.6

@github-actions github-actions bot removed the status: waiting for author Issue with insufficient information label Sep 20, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: icons Specific to @mui/icons
Projects
None yet
Development

No branches or pull requests

4 participants