Typescript: auto import always uses relative (to the current file) module paths in presense of baseUri

[zpdDG4gta8XKpMCd]

back in a day it used to be different

• at first it was always an absolute path (that is without "./" or "../" in it) relative to the baseUri
• then starting at some point it began to always show a popup with 2 options: absolute or relavive
• now (since like a week ago or so) it just always uses a relative path with "./" and "../" to the current file no matter what, without asking, which is very frustrating and annoying

how can i get the auto import to use absolute paths like it was back in the day?

[andy-ms]

There are two different auto import features:
a) import on completion: This is when you type an identifier for the first time and it is automatically imported. VSCode only wants to get one code action here because they don't want to display a dialog on completions.
2) Import fix: This is when there's an existing cannot-find-name error and we provide a codefix (light bulb) for it. This should be giving you both baseUrl and local path options.

Also, when choosing the action to use for completions (or display first for a code fix), we will prefer the shortest path. So we will only use a relative path if we see that it is simpler then coming down from the baseUrl.

[zpdDG4gta8XKpMCd]

i am talking about import on completion, because i cannot opt out from completion itself and import just comes with it

there are a few reasons i don't want ./ and ../ in my module paths:

• i compile the same code for AMD and CommonJs, and absolute paths are a common ground
• relative paths are a pain to maintain (move files around)

so how can i get the import on completion to use absolute paths (relative to baseUri) please?

[andy-ms]

It's possible that we could add an option in #20619 to always use baseUrl paths.
You could also set "typescript.autoImportSuggestions.enabled": false, in your vscode settings to opt out of the import completions feature entirely.

[alextreppass]

Hi @andy-ms - did #20619 allow for imports to use baseUrl paths? I see it's marked as closed via https://github.com/Microsoft/TypeScript/pull/22236, but I'm not sure whether that added the proposed option

Thanks

[mhegazy]

This should be exposed in VSCode (insiders as of now) under "typescript.preferences.importModuleSpecifier": "non-relative"

[jabsatz]

This keeps happening even with that option enabled, I read in another issue that the completion uses whichever path is shortest as a string and that you were looking into making that into an option. Any updates on that?

[andy-ms]

@jabsatz Could you provide a concrete reproducible example? We should always use a non-relative path if possible given that option.

[jabsatz]

jsconfig.json:

{
    "compilerOptions": {
        "target": "esnext",
        "allowSyntheticDefaultImports": true,
        "baseUrl": "./src",
        "paths": {
            "*": ["*"]
        },
    },
    "exclude": ["node_modules", "build"]
}

settings:

{
    "typescript.preferences.importModuleSpecifier": "non-relative",
}

If I'm correct, this should resolve packages non-relatively, and it does, but only sometimes. Say for example my folder structure is somewhat like this:

src/
├── components/
│   ├── common/
│   │   └── Dialog.jsx
│   └── profile/
│       └── Profile.jsx
└── utils/
    └── calc.js

If I write Dialog in Profile.jsx, intellisense will suggest auto-import from "../common/Dialog", however, if I try to write calc, instead of suggesting "../../utils/calc" it just suggests "utils/calc" (as I expect).

[andy-ms]

@jabsatz That's working for me (adds import { Dialog } from "components/common/Dialog";) when I tried it. Are you set up to use typescript@next?

[jabsatz]

No, should I?

[andy-ms]

Before that, I just noticed you're using .jsx files -- you might need to set "javascript.preferences.importModuleSpecifier" instead.

[jabsatz]

That did the trick! Thank you!