Merge pull request #1413 from 18F/sr-webpack-resolve-aliases

Use Babel to resolve project root & aliases

.babelrc

@@ -1,4 +1,21 @@
 {
     "presets": ["es2015", "react", "stage-2"],
-    "plugins": ["transform-class-properties"]
+    "plugins": [
+        ["module-resolver", {
+            "root": "./src",
+            "alias": {
+                "@actions": "./src/actions",
+                "@components": "./src/components",
+                "@config": "./src/config",
+                "@img": "./src/img",
+                "@plugins": "./src/plugins",
+                "@reducers": "./src/reducers",
+                "@schema": "./src/schema",
+                "@services": "./src/services",
+                "@validators": "./src/validators",
+                "@views": "./src/views"
+            }
+        }],
+	"transform-class-properties"
+    ]
 }

.eslintrc.yml

@@ -28,4 +28,17 @@ rules:
     - error
     - skipUndeclared: true
 settings:
-  import/resolver: webpack
+  import/resolver:
+    babel-module:
+      root: ['./src']
+      alias:
+        '@actions': './src/actions'
+        '@components': './src/components'
+        '@config': './src/config'
+        '@img': './src/img'
+        '@plugins': './src/plugins'
+        '@reducers': './src/reducers'
+        '@schema': './src/schema'
+        '@services': './src/services'
+        '@validators': './src/validators'
+        '@views': './src/views'

package.json

@@ -71,6 +71,7 @@
     "babel-core": "^6.26.3",
     "babel-eslint": "^10.0.1",
     "babel-loader": "^7.1.4",
+    "babel-plugin-module-resolver": "^3.1.3",
     "babel-plugin-transform-class-properties": "^6.24.1",
     "babel-preset-es2015": "^6.18.0",
     "babel-preset-react": "^6.16.0",
@@ -80,6 +81,7 @@
     "css-loader": "^2.1.0",
     "enzyme": "^2.9.1",
     "eslint": "^5.0.1",
+    "eslint-import-resolver-babel-module": "^4.0.0",
     "eslint-import-resolver-webpack": "^0.10.1",
     "eslint-plugin-import": "^2.13.0",
     "eslint-plugin-react": "^7.10.0",

src/actions/ApplicationActions.js

@@ -1,7 +1,7 @@
-import { env, navigationWalker } from '../config'
-import { api } from '../services'
-import schema, { unschema } from '../schema'
-import validate from '../validators'
+import { env, navigationWalker } from '@config'
+import { api } from '@services'
+import schema, { unschema } from '@schema'
+import validate from '@validators'
 
 export function getApplicationState(done) {
   return function(dispatch, getState) {

src/actions/AuthActions.js

@@ -1,5 +1,5 @@
-import { env } from '../config'
-import { api } from '../services/api'
+import { env } from '@config'
+import { api } from '@services/api'
 import AuthConstants from './AuthConstants'
 
 /**

src/actions/AuthActions.test.js

@@ -1,4 +1,4 @@
-import { api } from '../services/api'
+import { api } from '@services/api'
 import MockAdapter from 'axios-mock-adapter'
 import configureMockStore from 'redux-mock-store'
 import thunk from 'redux-thunk'

src/components/ErrorList/ErrorList.jsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { connect } from 'react-redux'
-import { navigationWalker } from '../../config'
-import { closest } from '../Form/Generic'
+import { navigationWalker } from '@config'
+import { closest } from '@components/Form/Generic'
 
 /**
  * The error list component.

src/components/Form/Consent/Consent.jsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { connect } from 'react-redux'
-import { i18n } from '../../../config'
-import { updateApplication } from '../../../actions/ApplicationActions'
-import Modal from '../Modal'
+import { i18n } from 'config'
+import { updateApplication } from '@actions/ApplicationActions'
+import Modal from '@components/Form/Modal'
 
 export class Consent extends React.Component {
   constructor(props) {