Create React App is a framework for quickly
diff --git a/packages/mui-joy/tsconfig.build.json b/packages/mui-joy/tsconfig.build.json
index 92aea03c9be6b9..08d063fe1554a9 100644
--- a/packages/mui-joy/tsconfig.build.json
+++ b/packages/mui-joy/tsconfig.build.json
@@ -13,7 +13,8 @@
"include": ["./src/**/*.ts*"],
"exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"],
"references": [
- { "path": "../mui-base/tsconfig.build.json" },
- { "path": "../mui-system/tsconfig.build.json" }
+ { "path": "../mui-utils/tsconfig.build.json" },
+ { "path": "../mui-system/tsconfig.build.json" },
+ { "path": "../mui-base/tsconfig.build.json" }
]
}
diff --git a/packages/mui-lab/tsconfig.build.json b/packages/mui-lab/tsconfig.build.json
index f3c9573d726cf3..05bed3c5989845 100644
--- a/packages/mui-lab/tsconfig.build.json
+++ b/packages/mui-lab/tsconfig.build.json
@@ -3,16 +3,18 @@
// Actual .ts source files are transpiled via babel
"extends": "./tsconfig.json",
"compilerOptions": {
- "noEmit": false,
+ "composite": true,
"declaration": true,
- "rootDir": "./src",
- "outDir": "./build",
- "emitDeclarationOnly": true
+ "noEmit": false,
+ "emitDeclarationOnly": true,
+ "outDir": "build",
+ "rootDir": "./src"
},
"include": ["src/**/*.ts*"],
"exclude": ["src/**/*.d.ts", "src/**/*.test.*", "./**/*.spec.*"],
"references": [
- { "path": "../mui-material/tsconfig.build.json" },
- { "path": "../mui-system/tsconfig.build.json" }
+ { "path": "../mui-utils/tsconfig.build.json" },
+ { "path": "../mui-system/tsconfig.build.json" },
+ { "path": "../mui-material/tsconfig.build.json" }
]
}
diff --git a/packages/mui-material-next/tsconfig.build.json b/packages/mui-material-next/tsconfig.build.json
index 99aed0580da8a7..3afca6763e8300 100644
--- a/packages/mui-material-next/tsconfig.build.json
+++ b/packages/mui-material-next/tsconfig.build.json
@@ -13,8 +13,8 @@
"include": ["./src/**/*.ts*"],
"exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"],
"references": [
+ { "path": "../mui-utils/tsconfig.build.json" },
{ "path": "../mui-base/tsconfig.build.json" },
- { "path": "../mui-material/tsconfig.build.json" },
- { "path": "../mui-system/tsconfig.build.json" }
+ { "path": "../mui-material/tsconfig.build.json" }
]
}
diff --git a/packages/mui-material/tsconfig.build.json b/packages/mui-material/tsconfig.build.json
index 92aea03c9be6b9..08d063fe1554a9 100644
--- a/packages/mui-material/tsconfig.build.json
+++ b/packages/mui-material/tsconfig.build.json
@@ -13,7 +13,8 @@
"include": ["./src/**/*.ts*"],
"exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"],
"references": [
- { "path": "../mui-base/tsconfig.build.json" },
- { "path": "../mui-system/tsconfig.build.json" }
+ { "path": "../mui-utils/tsconfig.build.json" },
+ { "path": "../mui-system/tsconfig.build.json" },
+ { "path": "../mui-base/tsconfig.build.json" }
]
}
diff --git a/scripts/muiAliases.js b/scripts/muiAliases.js
new file mode 100644
index 00000000000000..7fb2889ac3b4bd
--- /dev/null
+++ b/scripts/muiAliases.js
@@ -0,0 +1,46 @@
+const path = require('path');
+
+/**
+ * @param {object} params The parameters of the function.
+ * @param {'build' | 'src'} params.type Define if the target should be the built version or the source.
+ * @param {boolean | undefined} params.isRelative If `true` the path will be relative to the repository root.
+ * @param {boolean | undefined} params.useESIcons If `true` will use the ES version of `@mui/icons-material`.
+ */
+function getMuiAliases({ type, isRelative = false, useESIcons = false }) {
+ const workspaceRoot = path.join(__dirname, '..');
+
+ const resolveAliasPath = (aliasPath) => {
+ const fullPath = path.join(workspaceRoot, aliasPath);
+
+ if (!isRelative) {
+ return fullPath;
+ }
+
+ const resolvedPath = path.relative(process.cwd(), fullPath);
+ return `./${resolvedPath.replace('\\', '/')}`;
+ };
+
+ return {
+ '@mui/base': resolveAliasPath(`packages/mui-base/${type}`),
+ '@mui/docs': resolveAliasPath(`packages/mui-docs/${type}`),
+ '@mui/icons-material': resolveAliasPath(
+ `packages/mui-icons-material/lib${useESIcons ? '/esm' : ''}`,
+ ),
+ '@mui/joy': resolveAliasPath(`packages/mui-joy/${type}`),
+ '@mui/lab': resolveAliasPath(`packages/mui-lab/${type}`),
+ '@mui/markdown': resolveAliasPath('packages/markdown'),
+ '@mui/material': resolveAliasPath(`packages/mui-material/${type}`),
+ '@mui/material-next': resolveAliasPath(`packages/mui-material-next/${type}`),
+ '@mui/private-theming': resolveAliasPath(`packages/mui-private-theming/${type}`),
+ '@mui/styled-engine': resolveAliasPath(`packages/mui-styled-engine/${type}`),
+ '@mui/styled-engine-sc': resolveAliasPath(`packages/mui-styled-engine-sc/${type}`),
+ '@mui/styles': resolveAliasPath(`packages/mui-styles/${type}`),
+ '@mui/system': resolveAliasPath(`packages/mui-system/${type}`),
+ '@mui/utils': resolveAliasPath(`packages/mui-utils/${type}`),
+ docs: resolveAliasPath('docs'),
+ modules: resolveAliasPath('modules'),
+ 'typescript-to-proptypes': resolveAliasPath('packages/typescript-to-proptypes/src'),
+ };
+}
+
+module.exports = getMuiAliases;
diff --git a/scripts/sizeSnapshot/webpack.config.js b/scripts/sizeSnapshot/webpack.config.js
index fe935fd850052a..628c5d943dd7d6 100644
--- a/scripts/sizeSnapshot/webpack.config.js
+++ b/scripts/sizeSnapshot/webpack.config.js
@@ -3,6 +3,7 @@ const CompressionPlugin = require('compression-webpack-plugin');
const glob = require('fast-glob');
const TerserPlugin = require('terser-webpack-plugin');
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
+const getMuiAliases = require('../muiAliases');
const workspaceRoot = path.join(__dirname, '..', '..');
@@ -175,7 +176,7 @@ function createWebpackConfig(entry, environment) {
const configuration = {
// ideally this would be computed from the bundles peer dependencies
// Ensure that `react` as well as `react/*` are considered externals but not `react*`
- externals: /^(date-fns|dayjs|luxon|moment|react|react-dom)(\/.*)?$/,
+ externals: /^(react|react-dom)(\/.*)?$/,
mode: 'production',
optimization: {
concatenateModules,
@@ -208,19 +209,7 @@ function createWebpackConfig(entry, environment) {
}),
],
resolve: {
- alias: {
- '@mui/material': path.join(workspaceRoot, 'packages/mui-material/build'),
- '@mui/lab': path.join(workspaceRoot, 'packages/mui-lab/build'),
- '@mui/styled-engine': path.join(workspaceRoot, 'packages/mui-styled-engine/build'),
- '@mui/styled-engine-sc': path.join(workspaceRoot, 'packages/mui-styles-sc/build'),
- '@mui/styles': path.join(workspaceRoot, 'packages/mui-styles/build'),
- '@mui/system': path.join(workspaceRoot, 'packages/mui-system/build'),
- '@mui/private-theming': path.join(workspaceRoot, 'packages/mui-private-theming/build'),
- '@mui/utils': path.join(workspaceRoot, 'packages/mui-utils/build'),
- '@mui/base': path.join(workspaceRoot, 'packages/mui-base/build'),
- '@mui/material-next': path.join(workspaceRoot, 'packages/mui-material-next/build'),
- '@mui/joy': path.join(workspaceRoot, 'packages/mui-joy/build'),
- },
+ alias: getMuiAliases({ type: 'build' }),
},
entry: { [entry.id]: path.join(workspaceRoot, entry.path) },
// TODO: 'browserslist:modern'
diff --git a/test/karma.conf.js b/test/karma.conf.js
index 2f975fb47822bc..e7721be2e35ea0 100644
--- a/test/karma.conf.js
+++ b/test/karma.conf.js
@@ -1,6 +1,7 @@
const path = require('path');
const playwright = require('playwright');
const webpack = require('webpack');
+const getMuiAliases = require('../scripts/muiAliases');
const CI = Boolean(process.env.CI);
// renovate PRs are based off of upstream branches.
@@ -133,36 +134,22 @@ module.exports = function setKarmaConfig(config) {
envName: 'stable',
},
},
- // transpile 3rd party packages with dependencies in this repository
+ // Transpile dependencies outside this repository with dependencies in this repository
+ // TODO: Remove when the lab will stop exporting components from `@mui/x-tree-view`
{
test: /\.(js|mjs|jsx)$/,
- include:
- /node_modules(\/|\\)(notistack|@mui(\/|\\)x-data-grid|@mui(\/|\\)x-data-grid-pro|@mui(\/|\\)x-license-pro|@mui(\/|\\)x-data-grid-generator|@mui(\/|\\)x-date-pickers-pro|@mui(\/|\\)x-date-pickers|@mui(\/|\\)x-tree-view)/,
+ include: /node_modules(\/|\\)@mui(\/|\\)x-tree-view/,
use: {
loader: 'babel-loader',
options: {
- // We have to apply `babel-plugin-module-resolve` to the files in `@mui/x-date-pickers`.
- // Otherwise we can't import `@mui/material` from `@mui/x-date-pickers` in `yarn test:karma`.
+ // We have to apply `babel-plugin-module-resolve` to the files in `@mui/x-tree-view`.
+ // Otherwise, we can't import `@mui/material` from `@mui/x-tree-view` in `yarn test:karma`.
sourceType: 'unambiguous',
plugins: [
[
'babel-plugin-module-resolver',
{
- alias: {
- // all packages in this monorepo
- '@mui/material': './packages/mui-material/src',
- '@mui/docs': './packages/mui-docs/src',
- '@mui/icons-material': './packages/mui-icons-material/lib',
- '@mui/lab': './packages/mui-lab/src',
- '@mui/styled-engine': './packages/mui-styled-engine/src',
- '@mui/styles': './packages/mui-styles/src',
- '@mui/system': './packages/mui-system/src',
- '@mui/private-theming': './packages/mui-private-theming/src',
- '@mui/utils': './packages/mui-utils/src',
- '@mui/base': './packages/mui-base/src',
- '@mui/material-next': './packages/mui-material-next/src',
- '@mui/joy': './packages/mui-joy/src',
- },
+ alias: getMuiAliases({ type: 'src', isRelative: true }),
transformFunctions: ['require'],
},
],
diff --git a/tsconfig.json b/tsconfig.json
index f18dfa4f29d3ca..1b2a7bdb457b90 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -14,36 +14,44 @@
"noErrorTruncation": false,
"allowJs": true,
"paths": {
- "@mui/material": ["./packages/mui-material/src"],
- "@mui/material/*": ["./packages/mui-material/src/*"],
+ "@mui/base": ["./packages/mui-base/src"],
+ "@mui/base/*": ["./packages/mui-base/src/*"],
+ "@mui/docs": ["./packages/mui-docs/src"],
+ "@mui/docs/*": ["./packages/mui-docs/src/*"],
+ "@mui/icons-material": ["./packages/mui-icons-material/lib"],
+ "@mui/icons-material/*": ["./packages/mui-icons-material/lib/*"],
+ "@mui/joy": ["./packages/mui-joy/src"],
+ "@mui/joy/*": ["./packages/mui-joy/src/*"],
"@mui/lab": ["./packages/mui-lab/src"],
"@mui/lab/*": ["./packages/mui-lab/src/*"],
"@mui/markdown": ["./packages/markdown"],
"@mui/markdown/*": ["./packages/markdown/*"],
+ "@mui/material": ["./packages/mui-material/src"],
+ "@mui/material/*": ["./packages/mui-material/src/*"],
+ "@mui/material-next": ["./packages/mui-material-next/src"],
+ "@mui/material-next/*": ["./packages/mui-material-next/src/*"],
+ "@mui/private-theming": ["./packages/mui-private-theming/src"],
+ "@mui/private-theming/*": ["./packages/mui-private-theming/src/*"],
+ // Swap the comments on the next four lines for using the styled-components as style engine
"@mui/styled-engine": ["./packages/mui-styled-engine/src"],
"@mui/styled-engine/*": ["./packages/mui-styled-engine/src/*"],
+ // "@mui/styled-engine": ["./packages/mui-styled-engine-sc/src"],
+ // "@mui/styled-engine/*": ["./packages/mui-styled-engine-sc/src/*"],
"@mui/styled-engine-sc": ["./packages/mui-styled-engine-sc/src"],
"@mui/styled-engine-sc/*": ["./packages/mui-styled-engine-sc/src/*"],
"@mui/styles": ["./packages/mui-styles/src"],
"@mui/styles/*": ["./packages/mui-styles/src/*"],
"@mui/system": ["./packages/mui-system/src"],
"@mui/system/*": ["./packages/mui-system/src/*"],
- "@mui/private-theming": ["./packages/mui-private-theming/src"],
- "@mui/private-theming/*": ["./packages/mui-private-theming/src/*"],
"@mui/types": ["./packages/mui-types"],
- "@mui/base": ["./packages/mui-base/src"],
- "@mui/base/*": ["./packages/mui-base/src/*"],
"@mui/utils": ["./packages/mui-utils/src"],
"@mui/utils/*": ["./packages/mui-utils/src/*"],
- "@mui/docs": ["./packages/mui-docs/src"],
- "@mui/docs/*": ["./packages/mui-docs/src/*"],
- "@mui/material-next": ["./packages/mui-material-next/src"],
- "@mui/material-next/*": ["./packages/mui-material-next/src/*"],
- "@mui/joy": ["./packages/mui-joy/src"],
- "@mui/joy/*": ["./packages/mui-joy/src/*"],
"@mui/zero-runtime/*": ["./packages/zero-runtime/src/*"],
"@mui/zero-tag-processor/*": ["./packages/zero-tag-processor/src/*"],
"@mui/zero-vite-plugin/*": ["./packages/zero-vite-plugin/src/*"],
+ "docs/*": ["./docs/*"],
+ "modules/*": ["./modules/*"],
+ "pages/*": ["./docs/pages"],
"test/*": ["./test/*"],
"typescript-to-proptypes": ["./packages/typescript-to-proptypes/src"]
},
diff --git a/webpackBaseConfig.js b/webpackBaseConfig.js
index 0b9c59bdf248fb..a136cd4c3ca07d 100644
--- a/webpackBaseConfig.js
+++ b/webpackBaseConfig.js
@@ -1,4 +1,5 @@
const path = require('path');
+const getMuiAliases = require('./scripts/muiAliases');
// WARNING: Use this module only as an inspiration.
// Cherry-pick the parts you need and inline them in the webpack.config you need.
@@ -8,24 +9,7 @@ module.exports = {
context: path.resolve(__dirname),
resolve: {
modules: [__dirname, 'node_modules'],
- alias: {
- '@mui/markdown': path.resolve(__dirname, './packages/markdown'),
- '@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/styles': path.resolve(__dirname, './packages/mui-styles/src'),
- '@mui/system': path.resolve(__dirname, './packages/mui-system/src'),
- '@mui/private-theming': path.resolve(__dirname, './packages/mui-private-theming/src'),
- '@mui/base': path.resolve(__dirname, './packages/mui-base/src'),
- '@mui/utils': path.resolve(__dirname, './packages/mui-utils/src'),
- '@mui/material-next': path.resolve(__dirname, './packages/mui-material-next/src'),
- '@mui/joy': path.resolve(__dirname, './packages/mui-joy/src'),
- 'typescript-to-proptypes': path.resolve(__dirname, './packages/typescript-to-proptypes/src'),
- docs: path.resolve(__dirname, './docs'),
- },
+ alias: getMuiAliases({ type: 'src', useESIcons: true }),
extensions: ['.js', '.ts', '.tsx', '.d.ts'],
},
};