Setting up webpack resolve root

package.json

@@ -32,8 +32,12 @@
     "snapshotSerializers": [
       "enzyme-to-json/serializer"
     ],
+    "modulePaths": [
+      "src",
+      "node_modules"
+    ],
     "moduleNameMapper": {
-      "\\.svg$": "<rootDir>/src/__mocks__/svgMock.js",
+      "\\.svg$": "__mocks__/svgMock.js",
       "\\.css$": "identity-obj-proxy"
     },
     "collectCoverageFrom": [

src/components/App.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import Message from './Message';
+import Message from 'components/Message';
 
 const App = () => (
   <Message heading="React App">

src/components/RavenBoundary/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import RavenError from '../RavenError';
+import RavenError from 'components/RavenError';
 
 class RavenBoundary extends React.Component {
   constructor() {

src/components/RavenError/index.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { translate, Trans } from 'react-i18next';
-import { Raven } from '../../sentry';
+import { Raven } from 'sentry';
 
-import Message from '../Message';
+import Message from 'components/Message';
 import AlertIcon from 'feather-icons/dist/icons/alert-octagon.svg';
 
 class RavenError extends React.Component {

src/pages/404/Component.js

@@ -2,10 +2,10 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { translate, Trans } from 'react-i18next';
 
-import Message from '../../components/Message';
+import Message from 'components/Message';
 import AlertIcon from 'feather-icons/dist/icons/alert-octagon.svg';
-import Header from '../../components/Header';
+import Header from 'components/Header';
-import Footer from '../../components/Footer';
+import Footer from 'components/Footer';
 
 const Component = ({ t }) => (
   <React.Fragment>

src/pages/404/browser.js

@@ -2,12 +2,12 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 
 import Component from './Component';
-import RavenBoundary from '../../components/RavenBoundary';
+import RavenBoundary from 'components/RavenBoundary';
 
-import '../../style.css';
+import 'site.css';
-import '../../i18n';
+import 'i18n';
-import { setupGA } from '../../analytics';
+import { setupGA } from 'analytics';
-import { Raven, setupRaven } from '../../sentry';
+import { Raven, setupRaven } from 'sentry';
 
 setupRaven();
 

src/pages/index/Component.js

@@ -1,10 +1,10 @@
 import React from 'react';
 
-import Message from '../../components/Message';
+import Message from 'components/Message';
 import AlertIcon from 'feather-icons/dist/icons/alert-octagon.svg';
-import Header from '../../components/Header';
+import Header from 'components/Header';
-import Footer from '../../components/Footer';
+import Footer from 'components/Footer';
-import App from '../../components/App';
+import App from 'components/App';
 
 const Component = () => (
   <React.Fragment>

src/pages/index/browser.js

@@ -2,13 +2,13 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 
 import Component from './Component';
-import RavenBoundary from '../../components/RavenBoundary';
+import RavenBoundary from 'components/RavenBoundary';
 
-import '../../style.css';
+import 'site.css';
-import '../../i18n';
+import 'i18n';
-import { setupServiceWorker } from '../../service-worker';
+import { setupServiceWorker } from 'service-worker';
-import { setupGA } from '../../analytics';
+import { setupGA } from 'analytics';
-import { Raven, setupRaven } from '../../sentry';
+import { Raven, setupRaven } from 'sentry';
 
 setupRaven();
 

webpack.common.js

@@ -44,6 +44,9 @@ module.exports = {
     chunkFilename: 'js/[name].[chunkhash:8].js',
     path: path.resolve(__dirname, 'build')
   },
+  resolve: {
+    modules: ['src', 'node_modules']
+  },
   plugins: [
     new webpack.EnvironmentPlugin({
       NODE_ENV: 'development',

webpack.prod.js

@@ -34,6 +34,9 @@ module.exports = [
       chunkFilename: '[name].chunk.js',
       path: path.resolve(__dirname, 'prerender')
     },
+    resolve: {
+      modules: ['src', 'node_modules']
+    },
     plugins: [
       // Only want the EnvironmentPlugin
       common.plugins.find(plugin => plugin instanceof webpack.EnvironmentPlugin)