Cannot configure absolute import on new payload project

I'm trying to configure absolute import in my newly created payload project. I wanted to map

to

. Typescript intellisense in VSCode picked up the path mapping, but when I run

, it gives me the following error:

ERROR in ./src/payload.config.ts 70:0-40
Module not found: Error: Can't resolve '@/constants' in '/path/to/project/src'
 @ ./node_modules/payload/dist/admin/Root.js 9:41-66
 @ ./node_modules/payload/dist/admin/index.js 10:31-48

Here's my tsconfig.json

# tsconfig.json
{
    "compilerOptions": {
        "target": "es5",
        "lib": ["dom", "dom.iterable", "esnext"],
        "allowJs": true,
        "strict": false,
        "esModuleInterop": true,
        "skipLibCheck": true,
        "outDir": "./dist",
        "rootDir": "./src",
        "jsx": "react",
        "baseUrl": ".",
        "paths": {
            "payload/generated-types": ["src/payload-types.ts"],
            "@/*": ["src/*"]
        }
    },
    "include": ["src"],
    "exclude": ["node_modules", "dist", "build"],
    "ts-node": {
        "transpileOnly": true,
        "swc": true
    }
}

Here's my payload admin build config:

{
        ...
    admin: {
        user: users.slug,
        webpack: (config) => ({
            ...config,
            resolve: {
                ...config.resolve,
                alias: {
                    ...config.resolve.alias,
                    "@": ["src/*"]
                }
            }
        })
    },
        ...
}

I resolved the issue by having the following in my admin webpack config:

{
        ...
    admin: {
        user: users.slug,
        webpack: (config) => ({
            ...config,
            resolve: {
                ...config.resolve,
                alias: {
                    ...config.resolve.alias,
                    "@": __dirname // payload.config.ts is already located in src folder
                }
            }
        })
    },
        ...
}