Cannot resolve directory '~' with dynamic import('~/dir')

[stephenjason89]

Dynamically imported directory throws this error

Normal imports are working fine

here is my tsconfig.json

{
    "compilerOptions": {
        "target": "ES2018",
        "module": "ESNext",
        "moduleResolution": "node",
        "lib": ["ESNext", "ESNext.AsyncIterable", "DOM"],
        "esModuleInterop": true,
        "allowJs": true,
        "sourceMap": true,
        "strict": true,
        "noEmit": true,
        "experimentalDecorators": true,
        "baseUrl": ".",
        "paths": {
            "~/*": ["./client/*"],
            "@/*": ["./client/*"]
        },
        "types": ["@nuxt/types", "@types/node"]
    },
    "exclude": ["node_modules", ".nuxt"]
}

Please let me know if you would need more information.

    "@nuxt/typescript-build": "^2.1.0",
    "nuxt": "^2.15.6",

Thank you

A temporary solution would be to write it like 'url' instead of `url`

import('~/graphql/User.js')

I am using template literal because i am dynamically importing based on a variable
import(`~/graphql/${this.model}.js`)

I would need to write this as
import('~/graphql/'+this.model+'.js')
Just to remove the error