diff --git a/CHANGELOG.md b/CHANGELOG.md
index d794dee..f6d858a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,10 @@
 # generator-react-webpack - Changelog
 
+## 2.2.4
+___Upgrades:___
+
+1. Added automatic generation of components displayName property. This makes it easier to keep track of components that reside in deep subfolders (like src/components/my/example/components/indexComponent) would become "index" as a displayName, but should instead be MyExampleComponentsIndexComponent instead.
+
 ## 2.2.3
 ___Fixes:___
 
diff --git a/generators/component/templates/components/Base.js b/generators/component/templates/components/Base.js
index 4008db2..eff2a97 100644
--- a/generators/component/templates/components/Base.js
+++ b/generators/component/templates/components/Base.js
@@ -14,8 +14,11 @@ class <%= component.className %> extends React.Component {
   }
 }
 
+<%= component.className %>.displayName = '<%= component.displayName %>';
+
 // Uncomment properties you need
 // <%= component.className %>.propTypes = {};
 // <%= component.className %>.defaultProps = {};
 
+
 export default <%= component.className %>;
diff --git a/test/generators/component/indexTest.js b/test/generators/component/indexTest.js
index 2eb3a54..0e7b65f 100644
--- a/test/generators/component/indexTest.js
+++ b/test/generators/component/indexTest.js
@@ -47,6 +47,14 @@ describe('react-webpack:component', () => {
           done();
         });
       });
+
+      it('should have its displayName set per default', (done) => {
+
+        createGeneratedComponent('mycomponent', 'css', () => {
+          assert.fileContent('src/components/MycomponentComponent.js', `displayName = 'MycomponentComponent';`);
+          done();
+        });
+      });
     });
 
     describe('Style', () => {
diff --git a/test/utils/yeomanTest.js b/test/utils/yeomanTest.js
index 7368526..9b5c267 100644
--- a/test/utils/yeomanTest.js
+++ b/test/utils/yeomanTest.js
@@ -82,6 +82,7 @@ describe('Utilities:Yeoman', () => {
           path: 'src/components/my/component/',
           fileName: 'TestComponent.js',
           className: 'TestComponent',
+          displayName: 'MyComponentTestComponent',
           suffix: '.js'
         },
         test: {
diff --git a/utils/yeoman.js b/utils/yeoman.js
index a19fe9a..2cee20c 100644
--- a/utils/yeoman.js
+++ b/utils/yeoman.js
@@ -33,6 +33,9 @@ let getAllSettingsFromComponentName = (componentName, style) => {
   let componentBaseName = _.capitalize(componentParts.pop());
   let componentPartPath = componentParts.join('/');
 
+  // Get the components displayName property
+  let componentFullName = _.classify(_.replaceAll(componentName, '/', '_'));
+
   // Configure Styles
   let stylePaths = configUtils.getChoiceByKey('path', 'style');
   let styleSettings = configUtils.getChoiceByKey('style', style);
@@ -56,6 +59,7 @@ let getAllSettingsFromComponentName = (componentName, style) => {
       path: `${componentPath.path}/${componentPartPath}/`,
       fileName: `${componentBaseName}Component.js`,
       className: `${componentBaseName}Component`,
+      displayName: `${componentFullName}Component`,
       suffix: '.js'
     },
     test: {