Nuxt•2mo ago

How to configure "~" alias when working with Docker?

Currently I have not set "alias" (thus using the defaults) in nuxt.config.js. I use paths like

import { formatDate } from '~/shared/datetime.mjs';
import { fsw as nl } from '~/lang/nl.mjs';
import { fsw as en } from '~/lang/en.mjs';

import { formatDate } from '~/shared/datetime.mjs';
import { fsw as nl } from '~/lang/nl.mjs';
import { fsw as en } from '~/lang/en.mjs';

This works fine when running dev server or building (which we do inside Docker). VSCode on the other hand (working in the host) does not like this (see attachment). The cause of the problem is that inside Docker the base path is at /var/app while on the host this is mapped to /user/me/projects/myproject. Is there a way to get aliasses to work both inside and outside Docker?

1 Reply

Hendrik Jan•2mo ago

I seem to have found a solution. The tsconfig.json option "paths" actually uses relative paths, so they will work both inside Docker and outside Docker. Added this to my tsconfig.json:

"compilerOptions": {
    "paths": {
      "~/*": ["./*"],
      "~~/*": ["./*"],
    }
}

"compilerOptions": {
    "paths": {
      "~/*": ["./*"],
      "~~/*": ["./*"],
    }
}

Now VSCode understands where to look for ~/assets and so on.

Gaming

Programming

How to configure "~" alias when working with Docker?