diff --git a/services/web/tsconfig.json b/services/web/tsconfig.json
index d97f6fd147..f877459db8 100644
--- a/services/web/tsconfig.json
+++ b/services/web/tsconfig.json
@@ -11,6 +11,9 @@
     "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */,
     "skipLibCheck": true /* Skip type checking of declaration files. */,
     "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */,
+    "paths": {
+      "@/*": ["./frontend/js/*"]
+    },
     "types": ["cypress", "@testing-library/cypress"]
   },
   "include": [
diff --git a/services/web/webpack.config.js b/services/web/webpack.config.js
index 71c7b9061e..79450e983a 100644
--- a/services/web/webpack.config.js
+++ b/services/web/webpack.config.js
@@ -236,6 +236,9 @@ module.exports = {
 
       // Enables ace/ace shortcut
       ace: 'ace-builds/src-noconflict',
+
+      // custom prefixes for import paths
+      '@': path.resolve(__dirname, './frontend/js/'),
     },
     // symlinks: false, // enable this while using `npm link`
     extensions: ['.js', '.jsx', '.ts', '.tsx', '.json'],