[core] Use exports instead of aliases where possible

babel.config.js

@@ -9,7 +9,6 @@ function resolveAliasPath(relativeToBabelConf) {
 }
 
 const defaultAlias = {
-  '@material-ui/core': resolveAliasPath('./packages/material-ui/src'),
   '@material-ui/docs': resolveAliasPath('./packages/material-ui-docs/src'),
   '@material-ui/icons': resolveAliasPath('./packages/material-ui-icons/src'),
   '@material-ui/lab': resolveAliasPath('./packages/material-ui-lab/src'),

docs/babel.config.js

@@ -13,6 +13,7 @@ function resolvePath(sourcePath, currentFile, opts) {
   return bpmr.resolvePath(sourcePath, currentFile, opts);
 }
 
+// TODO: Can be dropped with webpack 5 which supports the `exports` field
 const alias = {
   '@material-ui/core': '../packages/material-ui/src',
   '@material-ui/docs': '../packages/material-ui-docs/src',

packages/material-ui-codemod/src/v4.0.0/optimal-imports.js

@@ -2,6 +2,7 @@ import { dirname } from 'path';
 import addImports from 'jscodeshift-add-imports';
 import getJSExports from '../util/getJSExports';
 
+// TODO: do we still need this?
 // istanbul ignore next
 if (process.env.NODE_ENV === 'test') {
   const resolve = require.resolve;

packages/material-ui-codemod/src/v4.0.0/top-level-imports.js

@@ -7,6 +7,7 @@ export default function transformer(fileInfo, api, options) {
 
   let requirePath = importModule;
 
+  // TODO: do we still need this?
   if (process.env.NODE_ENV === 'test') {
     requirePath = requirePath.replace(/^@material-ui\/core/, '../../../material-ui/src');
   }

packages/material-ui/package.json

@@ -4,7 +4,10 @@
   "private": false,
   "author": "Material-UI Team",
   "description": "Quickly build beautiful React apps. Material-UI is a simple and customizable component library to build faster, beautiful, and more accessible React applications. Follow your own design system, or start with Material Design.",
-  "main": "./src/index.ts",
+  "exports": {
+    ".": "./index.ts",
+    "./*": "./src/*/index.js"
+  },
   "keywords": [
     "react",
     "react-component",

scripts/copy-files.js

@@ -66,9 +66,16 @@ async function typescriptCopy({ from, to }) {
 
 async function createPackageFile() {
   const packageData = await fse.readFile(path.resolve(packagePath, './package.json'), 'utf8');
-  const { nyc, scripts, devDependencies, workspaces, ...packageDataOther } = JSON.parse(
-    packageData,
-  );
+  const {
+    nyc,
+    scripts,
+    devDependencies,
+    workspaces,
+    // Using native ES 6 modules internally only for now
+    exports,
+    type,
+    ...packageDataOther
+  } = JSON.parse(packageData);
 
   const newPackageData = {
     ...packageDataOther,

webpackBaseConfig.js

@@ -8,6 +8,8 @@ module.exports = {
   context: path.resolve(__dirname),
   resolve: {
     modules: [__dirname, 'node_modules'],
+    // TODO: Can be dropped with webpack 5 which supports the `exports` field
+    // But might be required for eslint-plugin-import: https://github.com/benmosher/eslint-plugin-import/issues/1868
     alias: {
       '@material-ui/core': path.resolve(__dirname, './packages/material-ui/src'),
       '@material-ui/docs': path.resolve(__dirname, './packages/material-ui-docs/src'),