diff --git a/.eslintrc.js b/.eslintrc.js
index fc76cab..b9cc24e 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -17,7 +17,7 @@ module.exports = {
   settings: {
     'import/resolver': {
       typescript: {
-        project: './tsconfig.json',
+        project: ['./tsconfig.base.json', './apps/*/tsconfig.json'],
       },
     },
   },
diff --git a/apps/mobile/app/(tabs)/_layout.tsx b/apps/mobile/app/(tabs)/_layout.tsx
index f15ae21..19dbec3 100644
--- a/apps/mobile/app/(tabs)/_layout.tsx
+++ b/apps/mobile/app/(tabs)/_layout.tsx
@@ -1,7 +1,7 @@
 import { Tabs } from 'expo-router';
 
-import TabBarIcon from '../components/TabBarIcon';
-import Colors from '../constants/Colors';
+import TabBarIcon from '@/components/TabBarIcon';
+import Colors from '@/constants/Colors';
 
 export default function TabLayout() {
   return (
diff --git a/apps/mobile/app/(tabs)/about.tsx b/apps/mobile/app/(tabs)/about.tsx
index f2fcfcf..9075450 100644
--- a/apps/mobile/app/(tabs)/about.tsx
+++ b/apps/mobile/app/(tabs)/about.tsx
@@ -1,6 +1,5 @@
-import { Text } from '../components/ui/Text';
-
-import ScreenLayout from '../components/layout/ScreenLayout';
+import ScreenLayout from '@/components/layout/ScreenLayout';
+import { Text } from '@/components/ui/Text';
 
 export default function AboutScreen() {
   return (
diff --git a/apps/mobile/app/(tabs)/account.tsx b/apps/mobile/app/(tabs)/account.tsx
index f9d5488..5216bc5 100644
--- a/apps/mobile/app/(tabs)/account.tsx
+++ b/apps/mobile/app/(tabs)/account.tsx
@@ -1,5 +1,5 @@
-import { Text } from '../components/ui/Text';
-import ScreenLayout from '../components/layout/ScreenLayout';
+import ScreenLayout from '@/components/layout/ScreenLayout';
+import { Text } from '@/components/ui/Text';
 
 export default function AccountScreen() {
   return (
diff --git a/apps/mobile/app/(tabs)/index.tsx b/apps/mobile/app/(tabs)/index.tsx
index 0726086..50e4898 100644
--- a/apps/mobile/app/(tabs)/index.tsx
+++ b/apps/mobile/app/(tabs)/index.tsx
@@ -1,5 +1,5 @@
-import ScreenLayout from '../components/layout/ScreenLayout';
-import { Text } from '../components/ui/Text';
+import ScreenLayout from '@/components/layout/ScreenLayout';
+import { Text } from '@/components/ui/Text';
 
 export default function HomeScreen() {
   return (
diff --git a/apps/mobile/app/(tabs)/search/_layout.tsx b/apps/mobile/app/(tabs)/search/_layout.tsx
index e224f40..803fd2f 100644
--- a/apps/mobile/app/(tabs)/search/_layout.tsx
+++ b/apps/mobile/app/(tabs)/search/_layout.tsx
@@ -1,9 +1,10 @@
 import { ScrollView, View } from 'react-native';
-import { Text } from '../../components/ui/Text';
+
+import Item from '@/components/item/item';
+import ScreenLayout from '@/components/layout/ScreenLayout';
+import { Text } from '@/components/ui/Text';
 
 import Searchbar from './Searchbar';
-import ScreenLayout from '../../components/layout/ScreenLayout';
-import Item from '../../components/item/item';
 
 export default function SearchScreen() {
   return (
diff --git a/apps/mobile/app/(tabs)/settings.tsx b/apps/mobile/app/(tabs)/settings.tsx
index 851d4bb..b59c0bd 100644
--- a/apps/mobile/app/(tabs)/settings.tsx
+++ b/apps/mobile/app/(tabs)/settings.tsx
@@ -1,6 +1,5 @@
-import { Text } from '../components/ui/Text';
-
-import ScreenLayout from '../components/layout/ScreenLayout';
+import ScreenLayout from '@/components/layout/ScreenLayout';
+import { Text } from '@/components/ui/Text';
 
 export default function SettingsScreen() {
   return (
diff --git a/apps/mobile/app/[...missing].tsx b/apps/mobile/app/[...missing].tsx
index 66c6bc6..c44b807 100644
--- a/apps/mobile/app/[...missing].tsx
+++ b/apps/mobile/app/[...missing].tsx
@@ -1,6 +1,7 @@
 import { Link, Stack } from 'expo-router';
 import { View } from 'react-native';
-import { Text } from './components/ui/Text';
+
+import { Text } from '@/components/ui/Text';
 
 export default function NotFoundScreen() {
   return (
diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx
index 07bfe89..f3c7669 100644
--- a/apps/mobile/app/_layout.tsx
+++ b/apps/mobile/app/_layout.tsx
@@ -10,7 +10,7 @@ import { SplashScreen, Stack } from 'expo-router';
 import { useEffect } from 'react';
 import { useColorScheme } from 'react-native';
 
-import Colors from './constants/Colors';
+import Colors from '@/constants/Colors';
 
 import './styles/global.css';
 
diff --git a/apps/mobile/app/components/TabBarIcon.tsx b/apps/mobile/app/components/TabBarIcon.tsx
index 2b0f57d..797a55e 100644
--- a/apps/mobile/app/components/TabBarIcon.tsx
+++ b/apps/mobile/app/components/TabBarIcon.tsx
@@ -1,5 +1,6 @@
 import { FontAwesome } from '@expo/vector-icons';
-import Colors from '../constants/Colors';
+
+import Colors from '@/constants/Colors';
 
 type Props = {
   focused?: boolean;
diff --git a/apps/mobile/app/components/item/item.tsx b/apps/mobile/app/components/item/item.tsx
index ce69095..2e6a3ec 100644
--- a/apps/mobile/app/components/item/item.tsx
+++ b/apps/mobile/app/components/item/item.tsx
@@ -1,7 +1,7 @@
 import { Image, View } from 'react-native';
-import { Text } from '../../components/ui/Text';
 
-import { TMDB_POSTER_PATH } from '../../constants/General';
+import { Text } from '@/components/ui/Text';
+import { TMDB_POSTER_PATH } from '@/constants/General';
 
 export default function Item() {
   return (
diff --git a/apps/mobile/app/components/layout/ScreenLayout.tsx b/apps/mobile/app/components/layout/ScreenLayout.tsx
index f67f0dd..a04d2c5 100644
--- a/apps/mobile/app/components/layout/ScreenLayout.tsx
+++ b/apps/mobile/app/components/layout/ScreenLayout.tsx
@@ -1,5 +1,6 @@
 import { View } from 'react-native';
-import { Text } from '../../components/ui/Text';
+
+import { Text } from '@/components/ui/Text';
 
 type Props = {
   title?: React.ReactNode | string;
diff --git a/apps/mobile/app/components/ui/Text.tsx b/apps/mobile/app/components/ui/Text.tsx
index 1a83774..2727577 100644
--- a/apps/mobile/app/components/ui/Text.tsx
+++ b/apps/mobile/app/components/ui/Text.tsx
@@ -1,7 +1,7 @@
 import { cva } from 'class-variance-authority';
 import { Text as RNText, TextProps } from 'react-native';
 
-import { cn } from '../../lib/utils';
+import { cn } from '@/lib/utils';
 
 const textVariants = cva('text-white');
 
diff --git a/apps/mobile/app/lib/utils.ts b/apps/mobile/app/lib/utils.ts
index 1396c24..e57f980 100644
--- a/apps/mobile/app/lib/utils.ts
+++ b/apps/mobile/app/lib/utils.ts
@@ -1,5 +1,5 @@
+import { ClassValue, clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
-import { clsx, ClassValue } from 'clsx';
 
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));
diff --git a/apps/mobile/metro.config.js b/apps/mobile/metro.config.js
index 251d86f..594ecb5 100644
--- a/apps/mobile/metro.config.js
+++ b/apps/mobile/metro.config.js
@@ -1,41 +1,3 @@
-// const { withNxMetro } = require('@nx/expo');
-// const { getDefaultConfig } = require('@expo/metro-config');
-// const { mergeConfig } = require('metro-config');
-// const { withNativeWind } = require('nativewind/metro');
-// const exclusionList = require('metro-config/src/defaults/exclusionList');
-
-// const defaultConfig = getDefaultConfig(__dirname);
-// const { assetExts, sourceExts } = defaultConfig.resolver;
-
-// /**
-//  * Metro configuration
-//  * https://facebook.github.io/metro/docs/configuration
-//  *
-//  * @type {import('metro-config').MetroConfig}
-//  */
-// const customConfig = {
-//   transformer: {
-//     babelTransformerPath: require.resolve('react-native-svg-transformer'),
-//   },
-//   resolver: {
-//     assetExts: assetExts.filter((ext) => ext !== 'svg'),
-//     sourceExts: [...sourceExts, 'svg'],
-//     blockList: exclusionList([/^(?!.*node_modules).*\/dist\/.*/]),
-//     // unstable_enableSymlinks: true,
-//     // unstable_enablePackageExports: true,
-//   },
-// };
-
-// module.exports = withNxMetro(mergeConfig(defaultConfig, customConfig), {
-//   // Change this to true to see debugging info.
-//   // Useful if you have issues resolving modules
-//   debug: false,
-//   // all the file extensions used for imports other than 'ts', 'tsx', 'js', 'jsx', 'json'
-//   extensions: [],
-//   // Specify folders to watch, in addition to Nx defaults (workspace libraries and node_modules)
-//   watchFolders: [],
-// });
-
 const { withNxMetro } = require('@nx/expo');
 const { getDefaultConfig } = require('@expo/metro-config');
 const { mergeConfig } = require('metro-config');
diff --git a/apps/mobile/package.json b/apps/mobile/package.json
index 6e2b30a..a3e1069 100644
--- a/apps/mobile/package.json
+++ b/apps/mobile/package.json
@@ -48,7 +48,8 @@
     "react-test-renderer": "*",
     "tailwind-merge": "^2.2.1",
     "tailwindcss": "3.3.2",
-    "typescript": "*"
+    "typescript": "*",
+    "prettier-plugin-tailwindcss": "*"
   },
   "scripts": {
     "eas-build-pre-install": "cd ../../ && node tools/scripts/eas-build-pre-install.mjs . apps/mobile && cp pnpm-lock.yaml apps/mobile",
diff --git a/apps/mobile/tsconfig.app.json b/apps/mobile/tsconfig.app.json
index 3882807..37e06a2 100644
--- a/apps/mobile/tsconfig.app.json
+++ b/apps/mobile/tsconfig.app.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "composite": true,
     "outDir": "../../dist/out-tsc",
-    "types": ["node"]
+    "types": ["node"],
   },
   "files": ["../../node_modules/@nx/expo/typings/svg.d.ts"],
   "exclude": [
diff --git a/apps/mobile/tsconfig.json b/apps/mobile/tsconfig.json
index a4a25aa..99e2d75 100644
--- a/apps/mobile/tsconfig.json
+++ b/apps/mobile/tsconfig.json
@@ -10,6 +10,12 @@
     "strict": true,
     "declaration": true,
     "allowJs": true,
+    "baseUrl": "./",
+    "paths": {
+      "@/*": [
+        "./app/*"
+      ],
+    }
   },
   "files": [],
   "include": [".expo/types/**/*.ts", "expo-env.d.ts"],