[code-infra] Remove webpack aliases (#45841)

Author: Janpot

package.json

@@ -141,10 +141,9 @@
     "@types/yargs": "^17.0.33",
     "@typescript-eslint/eslint-plugin": "^8.28.0",
     "@typescript-eslint/parser": "^8.28.0",
+    "@vitejs/plugin-react": "^4.3.4",
     "@vitest/browser": "^3.0.9",
     "@vitest/coverage-v8": "^3.0.9",
-    "@vitejs/plugin-react": "^4.3.4",
-    "vite": "^6.0.7",
     "babel-loader": "^9.2.1",
     "babel-plugin-istanbul": "^7.0.0",
     "babel-plugin-module-resolver": "^5.0.2",
@@ -201,8 +200,10 @@
     "stylelint": "^16.17.0",
     "stylelint-config-standard": "^37.0.0",
     "terser-webpack-plugin": "^5.3.14",
+    "tsconfig-paths-webpack-plugin": "^4.2.0",
     "tsx": "^4.19.3",
     "typescript": "^5.8.2",
+    "vite": "^6.0.7",
     "vitest": "^3.0.9",
     "vitest-fail-on-console": "^0.7.1",
     "webpack": "^5.98.0",

packages/mui-docs/tsconfig.build.json

@@ -11,10 +11,11 @@
     "rootDir": "./src",
     "tsBuildInfoFile": "build/tsconfig.build.tsbuildinfo"
   },
-  "include": ["src/**/*.ts*", "src/**/*.json"],
+  "include": ["./types.d.ts", "src/**/*.ts*", "src/**/*.json"],
   "exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"],
   "references": [
     { "path": "../mui-material/tsconfig.build.json" },
-    { "path": "../mui-system/tsconfig.build.json" }
+    { "path": "../mui-system/tsconfig.build.json" },
+    { "path": "../mui-icons-material/tsconfig.build.json" }
   ]
 }

packages/mui-docs/tsconfig.json

@@ -6,5 +6,5 @@
     "resolveJsonModule": true,
     "types": ["react", "node", "csstype", "mocha"]
   },
-  "include": ["src/**/*", "test/**/*"]
+  "include": ["./types.d.ts", "src/**/*", "test/**/*"]
 }

packages/mui-docs/types.d.ts

@@ -0,0 +1,6 @@
+// In our repo, type declarations for icons are only added at build time
+declare module '@mui/icons-material/*' {
+  import SvgIcon from '@mui/material/SvgIcon';
+
+  export default SvgIcon;
+}

packages/mui-icons-material/tsconfig.build.json

@@ -0,0 +1,14 @@
+{
+  // This config is for emitting declarations (.d.ts) only
+  // Actual .ts source files are transpiled via babel
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "composite": true,
+    "declaration": false,
+    "noEmit": false,
+    "emitDeclarationOnly": false,
+    "outDir": "build/esm",
+    "rootDir": "./lib"
+  },
+  "include": ["lib/**/*.*"]
+}

pnpm-lock.yaml

@@ -44,7 +44,7 @@
       "@mui/joy/package.json": ["./packages/mui-joy/package.json"],
       "@mui/joy/*": ["./packages/mui-joy/src/*"],
       "@mui/icons-material": ["./packages/mui-icons-material/lib/esm/index.js"],
-      "@mui/icons-material/*": ["./packages/mui-icons-material/src/icon.d.ts"],
+      "@mui/icons-material/*": ["./packages/mui-icons-material/lib/esm/*"],
       "@mui/internal-docs-utils": ["./packages-internal/docs-utils/src"],
       "@mui/internal-scripts/typescript-to-proptypes": [
         "./packages-internal/scripts/typescript-to-proptypes/src"

scripts/buildTypes.mjs

@@ -1,4 +1,7 @@
 const path = require('path');
+const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
+
+const extensions = ['.js', '.mjs', '.ts', '.tsx'];
 
 // WARNING: Use this module only as an inspiration.
 // Cherry-pick the parts you need and inline them in the webpack.config you need.
@@ -8,32 +11,7 @@ module.exports = {
   context: path.resolve(__dirname),
   resolve: {
     modules: [__dirname, 'node_modules'],
-    alias: {
-      '@mui/internal-markdown': path.resolve(__dirname, './packages/markdown'),
-      '@mui/material/package.json': path.resolve(__dirname, './packages/mui-material/package.json'),
-      '@mui/material': path.resolve(__dirname, './packages/mui-material/src'),
-      '@mui/docs': path.resolve(__dirname, './packages/mui-docs/src'),
-      '@mui/icons-material': path.resolve(__dirname, './packages/mui-icons-material/lib/esm'),
-      '@mui/lab': path.resolve(__dirname, './packages/mui-lab/src'),
-      '@mui/styled-engine': path.resolve(__dirname, './packages/mui-styled-engine/src'),
-      '@mui/styled-engine-sc': path.resolve(__dirname, './packages/mui-styled-engine-sc/src'),
-      '@mui/system/package.json': path.resolve(__dirname, './packages/mui-system/package.json'),
-      '@mui/system': path.resolve(__dirname, './packages/mui-system/src'),
-      '@mui/private-theming': path.resolve(__dirname, './packages/mui-private-theming/src'),
-      '@mui/base/package.json': path.resolve(__dirname, './packages/mui-base/package.json'),
-      '@mui/base': path.resolve(__dirname, './packages/mui-base/src'),
-      '@mui/utils': path.resolve(__dirname, './packages/mui-utils/src'),
-      '@mui/material-nextjs': path.resolve(__dirname, './packages/mui-material-nextjs/src'),
-      '@mui/joy/package.json': path.resolve(__dirname, './packages/mui-joy/package.json'),
-      '@mui/joy': path.resolve(__dirname, './packages/mui-joy/src'),
-      '@mui/internal-docs-utils': path.resolve(__dirname, './packages-internal/docs-utils/src'),
-      '@mui/internal-scripts/typescript-to-proptypes': path.resolve(
-        __dirname,
-        './packages-internal/scripts/typescript-to-proptypes/src',
-      ),
-      '@mui/internal-test-utils': path.resolve(__dirname, './packages-internal/test-utils/src'),
-      docs: path.resolve(__dirname, './docs'),
-    },
-    extensions: ['.js', '.mjs', '.ts', '.tsx', '.d.ts'],
+    extensions,
+    plugins: [new TsconfigPathsPlugin({ extensions })],
   },
 };