diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts index d9d2996cfaee6..e5e65b9a9cc13 100644 --- a/packages/next/src/build/webpack-config.ts +++ b/packages/next/src/build/webpack-config.ts @@ -481,7 +481,7 @@ function getOptimizedAliases(): { [pkg: string]: string } { } // Alias these modules to be resolved with "module" if possible. -function getModularizeImportAliases(packages: string[]) { +function getBarrelOptimizationAliases(packages: string[]) { const aliases: { [pkg: string]: string } = {} const mainFields = ['module', 'main'] @@ -492,7 +492,7 @@ function getModularizeImportAliases(packages: string[]) { for (const field of mainFields) { if (descriptionFileData.hasOwnProperty(field)) { - aliases[pkg] = path.join( + aliases[pkg + '$'] = path.join( path.dirname(descriptionFilePath), descriptionFileData[field] ) @@ -1142,7 +1142,7 @@ export default async function getBaseWebpackConfig( // For Node server, we need to re-alias the package imports to prefer to // resolve to the ESM export. ...(isNodeServer - ? getModularizeImportAliases( + ? getBarrelOptimizationAliases( config.experimental.optimizePackageImports || [] ) : {}), diff --git a/packages/next/src/server/config.ts b/packages/next/src/server/config.ts index 946ce1315bade..64eb5985699a2 100644 --- a/packages/next/src/server/config.ts +++ b/packages/next/src/server/config.ts @@ -676,14 +676,19 @@ function assignDefaults( ...userProvidedOptimizePackageImports, 'lucide-react', '@headlessui/react', - '@fortawesome/fontawesome-svg-core', - '@fortawesome/free-solid-svg-icons', '@headlessui-float/react', '@heroicons/react/20/solid', '@heroicons/react/24/solid', '@heroicons/react/24/outline', '@visx/visx', '@tremor/react', + 'rxjs', + '@mui/material', + 'recharts', + '@material-ui/core', + 'react-use', + '@material-ui/icons', + '@tabler/icons-react', ]), ]