diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-apps.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-apps.component.ts
index c4cf47adde..907bbf292f 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-apps.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-apps.component.ts
@@ -26,8 +26,8 @@ import { Observable } from 'rxjs/Observable';
 declare let componentHandler: any;
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-apps',
+    moduleId: module.id,
     templateUrl: 'activiti-apps.component.html',
     styleUrls: ['./activiti-apps.component.css', './activiti-apps-grid.component.css'],
     providers: [ActivitiTaskListService]
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-checklist.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-checklist.component.ts
index 397cd94bcd..8926744569 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-checklist.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-checklist.component.ts
@@ -22,8 +22,8 @@ import { TaskDetailsModel } from '../models/task-details.model';
 import { Observer, Observable } from 'rxjs/Rx';
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-checklist',
+    moduleId: module.id,
     templateUrl: './activiti-checklist.component.html',
     styleUrls: ['./activiti-checklist.component.css'],
     providers: [ActivitiTaskListService]
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-comments.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-comments.component.ts
index 894de64af5..795f2de34f 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-comments.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-comments.component.ts
@@ -22,8 +22,8 @@ import { Comment } from '../models/comment.model';
 import { Observer, Observable } from 'rxjs/Rx';
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-comments',
+    moduleId: module.id,
     templateUrl: './activiti-comments.component.html',
     styleUrls: ['./activiti-comments.component.css'],
     providers: [ActivitiTaskListService]
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-filters.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-filters.component.ts
index 7a52684ba2..845f100ae2 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-filters.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-filters.component.ts
@@ -25,8 +25,8 @@ import { Observable } from 'rxjs/Observable';
 declare let componentHandler: any;
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-filters',
+    moduleId: module.id,
     templateUrl: './activiti-filters.component.html',
     styleUrls: ['activiti-filters.component.css'],
     providers: [ActivitiTaskListService]
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.ts
index a8c1d88be9..bb47d0a404 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.ts
@@ -24,8 +24,8 @@ import { AlfrescoTranslationService } from 'ng2-alfresco-core';
 declare let componentHandler: any;
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-people-search',
+    moduleId: module.id,
     templateUrl: './activiti-people-search.component.html',
     styleUrls: ['./activiti-people-search.component.css']
 })
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people.component.ts
index 40ff66cfce..cb0662adaf 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people.component.ts
@@ -22,8 +22,8 @@ import { Observer, Observable } from 'rxjs/Rx';
 import { ActivitiPeopleService } from '../services/activiti-people.service';
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-people',
+    moduleId: module.id,
     templateUrl: './activiti-people.component.html',
     styleUrls: ['./activiti-people.component.css']
 })
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-start-task.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-start-task.component.ts
index c7ed7d9d2c..49c1be4402 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-start-task.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-start-task.component.ts
@@ -24,8 +24,8 @@ declare let componentHandler: any;
 declare let dialogPolyfill: any;
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-start-task',
+    moduleId: module.id,
     templateUrl: './activiti-start-task.component.html',
     styleUrls: ['./activiti-start-task.component.css']
 })
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-details.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-details.component.ts
index 14bb27f24e..d741b37ce7 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-details.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-details.component.ts
@@ -24,8 +24,8 @@ import { FormService, FormModel, FormOutcomeEvent } from 'ng2-activiti-form';
 import { TaskQueryRequestRepresentationModel } from '../models/filter.model';
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-task-details',
+    moduleId: module.id,
     templateUrl: './activiti-task-details.component.html',
     styleUrls: ['./activiti-task-details.component.css']
 })
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-header.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-header.component.ts
index facfe64854..8bbeafe872 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-header.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-task-header.component.ts
@@ -20,8 +20,8 @@ import { AlfrescoTranslationService } from 'ng2-alfresco-core';
 import { TaskDetailsModel } from '../models/task-details.model';
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-task-header',
+    moduleId: module.id,
     templateUrl: './activiti-task-header.component.html',
     styleUrls: ['./activiti-task-header.component.css']
 })
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-tasklist.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-tasklist.component.ts
index 436aceceb1..72c4d75a38 100644
--- a/ng2-components/ng2-activiti-tasklist/src/components/activiti-tasklist.component.ts
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-tasklist.component.ts
@@ -24,8 +24,8 @@ import { TaskQueryRequestRepresentationModel } from '../models/filter.model';
 declare let componentHandler: any;
 
 @Component({
-    moduleId: module.id,
     selector: 'activiti-tasklist',
+    moduleId: module.id,
     templateUrl: './activiti-tasklist.component.html',
     styleUrls: ['./activiti-tasklist.component.css']
 })
diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.ts b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.ts
index 89f9a4e14f..10aa5bbebd 100644
--- a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.ts
+++ b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.ts
@@ -69,7 +69,7 @@ export class DocumentList implements OnInit, AfterContentInit {
     }
 
     @Input()
-    fallbackThubnail: string = require('./../img/ft_ic_miscellaneous.svg');
+    fallbackThubnail: string = null;
 
     @Input()
     navigate: boolean = true;
@@ -156,11 +156,33 @@ export class DocumentList implements OnInit, AfterContentInit {
         private ngZone: NgZone,
         private translate: AlfrescoTranslationService) {
 
-        this.data = new ShareDataTableAdapter(this.documentListService, './..', []);
+        let rootPath = './..';
+        if (module && module.id) {
+            rootPath = module.id.replace('/components/document-list.js', '');
+        }
+
+        this.data = new ShareDataTableAdapter(this.documentListService, rootPath, []);
 
         if (translate) {
             translate.addTranslationFolder('ng2-alfresco-documentlist', 'node_modules/ng2-alfresco-documentlist/dist/src');
         }
+
+        this.fallbackThubnail = this.resolveIconPath('ft_ic_miscellaneous.svg');
+    }
+
+    resolveIconPath(icon: string): string {
+        let result = null;
+        try {
+            // webpack
+            result = require(`./../img/${icon}`);
+        } catch (e) {
+            // system.js
+            if (module && module.id) {
+                let baseComponentPath = module.id.replace('/components/document-list.js', '');
+                result = `${baseComponentPath}/img/${icon}`;
+            }
+        }
+        return result;
     }
 
     getContextActions(node: MinimalNodeEntity) {
diff --git a/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.ts b/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.ts
index 1cbda8b433..0c3d21f0c2 100644
--- a/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.ts
+++ b/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.ts
@@ -56,7 +56,7 @@ export class ShareDataTableAdapter implements DataTableAdapter, PaginationProvid
     rootPath: string = this.DEFAULT_ROOT_PATH;
 
     constructor(private documentListService: DocumentListService,
-                basePath: string,
+                private basePath: string,
                 schema: DataColumn[]) {
         this.dataLoaded = new DataLoadedEventEmitter();
         this.rows = [];
@@ -313,7 +313,17 @@ export class ShareDataTableAdapter implements DataTableAdapter, PaginationProvid
     }
 
     getImagePath(id: string): any {
-        return require(`./../img/${id}`);
+        let result = null;
+        try {
+            // webpack
+            result = require(`${this.basePath}/img/${id}`);
+        } catch (e) {
+            // system.js
+            if (module && module.id) {
+                result = `${this.basePath}/img/${id}`;
+            }
+        }
+        return result;
     }
 
     private resetPagination() {