Path alias is not working

[Eugene]

I have specified the following in my ts.config file

 "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext",
    ],
    "baseUrl": "./",
    "paths": {
      "~/*": ["src/*"]
    },
    "moduleResolution": "node",

The IDE does not complain when i import the module like so import Tab2 from '~/pages/Tab2'.

However, i am receiving the following error when trying to compile

ERROR in ./src/App.tsx 11:0-32
Module not found: Error: Can't resolve '@/pages/Tab2' in 'ui-kampung\src'
resolve '@/pages/Tab2' in 'ui-kampung\src'
  Parsed request is a module
  using description file: ui-kampung\package.json (relative path: ./src) 
    Field 'browser' doesn't contain a valid alias configuration
    resolve as module
      ui-kampung\src\node_modules doesn't exist or is not a directory
      looking for modules in ui-kampung\node_modules
        ui-kampung\node_modules\@\pages doesn't exist