diff --git a/template/package.json b/template/package.json
index 2b78570..fcbc428 100644
--- a/template/package.json
+++ b/template/package.json
@@ -27,7 +27,8 @@
         "preact-jsx-chai": "^3.0.0",
         "preact-markup": "^2.0.0",
         "preact-render-to-string": "^5.1.4",
-        "preact-router": "^3.2.1"
+        "preact-router": "^3.2.1",
+        "tsconfig-paths-webpack-plugin": "^3.2.0"
     },
     "devDependencies": {
         "@types/jest": "^25.1.2",
diff --git a/template/preact.config.js b/template/preact.config.js
index 61073dc..1e93c2f 100644
--- a/template/preact.config.js
+++ b/template/preact.config.js
@@ -1,4 +1,5 @@
 import { resolve } from "path";
+import { TsconfigPathsPlugin } from 'tsconfig-paths-webpack-plugin'
 
 export default {
     /**
@@ -24,6 +25,21 @@ export default {
             });
         });
 
+        // Add TsconfigPathsPlugin for webpack
+        // This allows webpack to resolve your imports whose location depends
+        // on the `baseUrl` and `paths` fields of your `tsconfig.json`
+        // https://github.com/dividab/tsconfig-paths-webpack-plugin#tsconfig-paths-webpack-plugin
+        config.resolve.plugins = [
+            ...(config.resolve.plugins || []),
+            new TsconfigPathsPlugin({
+                // We use `config.resolve.extensions` to load the same extensions
+                // as webpack already does. If you are to edit this property,
+                // do it before this call if you want TsconfigPathsPlugin
+                // to beneficiate from it
+                extensions: config.resolve.extensions
+            })
+        ]
+
         // Use any `index` file, not just index.js
         config.resolve.alias["preact-cli-entrypoint"] = resolve(
             process.cwd(),