Add image and process using Webpack

frederikprijck · Feb 15, 2020 · c860be3 · c860be3
1 parent f7d34fa
commit c860be3
Show file tree

Hide file tree

Showing 6 changed files with 29 additions and 38 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/app/core/components/app/app.component.html b/src/app/core/components/app/app.component.html
@@ -0,0 +1,4 @@
+<div class="app">
+    <img src="../../../../assets/image.png" />
+    <div ui-view></div>
+</div>
diff --git a/src/app/core/components/app/app.component.scss b/src/app/core/components/app/app.component.scss
@@ -1,3 +1,7 @@
 .app {
     padding: 5px 15px;
-}
+    img {
+        width: 50px;
+        height: 50px;
+    }
+}
diff --git a/src/app/core/components/app/app.component.ts b/src/app/core/components/app/app.component.ts
@@ -5,5 +5,5 @@ import './app.component.scss';
 
 export class App implements angular.IComponentOptions {
     static selector = 'app';
-    static template = '<div class="app" ui-view></div>';
+    static template = require('./app.component.html');
 }
diff --git a/src/assets/image.png b/src/assets/image.png
diff --git a/webpack.config.js b/webpack.config.js
@@ -49,7 +49,12 @@ module.exports = {
 
             {
                 test: /\.(jpg|png|gif)$/,
-                use: 'file-loader'
+                use: [{
+                    loader: 'file-loader',
+                    options: {
+                        esModule: false,
+                    },
+                }],
             },
 
             {