diff --git a/packages/react-scripts/config/alias.js b/packages/react-scripts/config/alias.js new file mode 100644 index 00000000000..f1d4098aad0 --- /dev/null +++ b/packages/react-scripts/config/alias.js @@ -0,0 +1,16 @@ +const paths = require('./paths'); +const appPackageJson = require(paths.appPackageJson); +const definedAliases = appPackageJson.alias || []; + +if (!Array.isArray(definedAliases)) { + throw new Error('Your alias declaration must be an array'); +} + +const alias = definedAliases.reduce((accum, current) => { + if (current.expose && current.source) { + accum[current.expose] = current.source; + } + return accum; +}, {}); + +module.exports = alias; diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js index a6be022ba25..853520c506a 100644 --- a/packages/react-scripts/config/webpack.config.dev.js +++ b/packages/react-scripts/config/webpack.config.dev.js @@ -17,6 +17,7 @@ const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin'); const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin'); const eslintFormatter = require('react-dev-utils/eslintFormatter'); const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin'); +const alias = require('./alias'); const getClientEnvironment = require('./env'); const paths = require('./paths'); @@ -91,7 +92,7 @@ module.exports = { // `web` extension prefixes have been added for better support // for React Native Web. extensions: ['.web.js', '.mjs', '.js', '.json', '.web.jsx', '.jsx'], - alias: { + alias: Object.assign({ // @remove-on-eject-begin // Resolve Babel runtime relative to react-scripts. // It usually still works on npm 3 without this but it would be @@ -104,7 +105,7 @@ module.exports = { // Support React Native Web // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ 'react-native': 'react-native-web', - }, + }, alias), plugins: [ // Prevents users from importing files from outside of src/ (or node_modules/). // This often causes confusion because we only process files within src/ with babel. diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index 457a9672892..01ff5b4f140 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -18,6 +18,7 @@ const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin'); const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin'); const eslintFormatter = require('react-dev-utils/eslintFormatter'); const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin'); +const alias = require('./alias'); const paths = require('./paths'); const getClientEnvironment = require('./env'); @@ -97,7 +98,7 @@ module.exports = { // `web` extension prefixes have been added for better support // for React Native Web. extensions: ['.web.js', '.mjs', '.js', '.json', '.web.jsx', '.jsx'], - alias: { + alias: Object.assign({ // @remove-on-eject-begin // Resolve Babel runtime relative to react-scripts. // It usually still works on npm 3 without this but it would be @@ -110,7 +111,7 @@ module.exports = { // Support React Native Web // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ 'react-native': 'react-native-web', - }, + }, alias), plugins: [ // Prevents users from importing files from outside of src/ (or node_modules/). // This often causes confusion because we only process files within src/ with babel. diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json index dcac53cf49f..e5e01cb56e7 100644 --- a/packages/react-scripts/package.json +++ b/packages/react-scripts/package.json @@ -64,5 +64,11 @@ }, "optionalDependencies": { "fsevents": "1.1.2" - } + }, + "alias": [ + { + "source": "./src", + "expose": "src" + } + ] }