Skip to content

[icons] Add exports field to package.json #43624

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.

Sign up for GitHub

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

Merged
merged 8 commits into from
Sep 10, 2024
Merged

[icons] Add exports field to package.json #43624

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
a886cf5
Update package.json
Janpot Sep 5, 2024
bede498
Update package.json
Janpot Sep 5, 2024
365fb83
Update vite.config.ts
Janpot Sep 5, 2024
4015424
Update package.json
Janpot Sep 5, 2024
8cd6e2b
Update package.json
Janpot Sep 5, 2024
e99fd47
Update package.json
Janpot Sep 5, 2024
7d0a528
Remove node condition
Janpot Sep 10, 2024
05b31b2
Merge remote-tracking branch 'upstream/master' into icons-esm
Janpot Sep 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 0 additions & 8 deletions apps/pigment-css-vite-app/vite.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,12 +47,4 @@ export default defineConfig({
splitVendorChunkPlugin(),
nodePolyfills(),
],
resolve: {
alias: [
{
find: /^@mui\/icons-material\/(.*)/,
replacement: '@mui/icons-material/esm/$1',
},
],
},
});
14 changes: 14 additions & 0 deletions packages/mui-icons-material/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,5 +83,19 @@
},
"engines": {
"node": ">=14.0.0"
},
"exports": {
".": {
"types": "./index.d.ts",
"import": "./esm/index.js",
"require": "./index.js"
},
"./*": {
"types": "./*.d.ts",
"import": "./esm/*.js",
"require": "./*.js"
},
"./esm/*": "./esm/*.js",
Copy link
Contributor

@brijeshb42 brijeshb42 Sep 9, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why has this been added? For backward compatibility ?

Copy link
Member Author

@Janpot Janpot Sep 9, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Exactly, someone might have added

  resolve: {
    alias: [
      {
        find: /^@mui\/icons-material\/(.*)/,
        replacement: '@mui/icons-material/esm/$1',
      },
    ],
  },

to their vite config. It means under the hood their bundler is changing @mui/icons-material/Add to @mui/icons-material/esm/Add before the package.json resolution algorithm has even kicked in. If we don't add an export for this, that module request will follow the ./* => ./esm/*.js export and try to access ./esm/esm/Add.js (* == esm/Add). When we add this export, we special case the ./esm path to not add an extra esm segment (* == Add). We can remove this in a major version.

Same problem for users of https://github.com/avocadowastaken/babel-plugin-direct-import?tab=readme-ov-file#example

edit: you can test this with the pigment vite app. removing the export and putting back the vite config should break its build

"./esm/*.js": "./esm/*.js"
}
}