path-intellisense.mappings doesn't work / not used correctly

[lironess]

i tried using that to solve my webpack absolute pathto autocomplete modules.

• The projects sits on /Users/myuser/Workspace/foo.
• The directory that I want to autocomplete is /Users/myuser/Workspace/foo/src.
• I want to use it on my code so I can write in a file:

import Bar from 'utils/bar'

and it will be resolved to: /Users/myuser/Workspace/foo/src/utils/bar.

I tried as above:

"path-intellisense.mappings": {
    "/": "${workspaceRoot}/src"
}

what am i doing wrong ?

also - my src folder contains 10 directories that I want to be auto-mapped.. do I have to add a record for each of them or it will be auto-mapped ?

[ChristianKohler]

Try to add a slash before the path:

import Bar from '/utils/bar'

Does this work?

[lironess]

nope :(

[lironess]

no way to make it without / and just to import resolve from webpack config ?

[ekorzun]

Got the same issue.

Here is my config:

"path-intellisense.mappings": {
    "/": "${workspaceRoot}/main/src",
    "controllers": "${workspaceRoot}/main/src/controllers",
    "components": "${workspaceRoot}/main/src/components"
}

When I use it with elements' attrs it works

It also works with exports

But the only thing I need to be work – doesn't work :)

[lekhnath]

I've the following settings:

"path-intellisense.mappings": {
      "src": "${workspaceRoot}/src",
      "server": "${workspaceRoot}/server"
  }

and having the same issue as @korzhik mentioned.

But this feature was working fine for me in its previous version 1.1.0, auto suggest while importing and/or requireing suddendly break after upgrading to its latest v1.2.0.

[ChristianKohler]

i tried to reproduce the error. I set the same setting as @korzhik and set up the same folder structure. It works on my mac. Could you help me to reproduce the problem? Best would be a small project which I could clone. Thank you.

"components": "${workspaceRoot}/main/src/components"

[mike623]

@ChristianKohler as you said. It is work. But is not similar behaviour as how alias in webpack work.
for example.

I expect
"*": "${workspaceRoot}/main/src" instead of
"components": "${workspaceRoot}/main/src/components"

Then I can type whatever import x from components or import y from containers.
In your case. Should I need to keep maintain project structure?

[lironess]

@ChristianKohler even your example doesn't work for me...
here are my extensions:

CoenraadS.bracket-pair-colorizer
christian-kohler.npm-intellisense
christian-kohler.path-intellisense
dbaeumer.vscode-eslint
donjayamanne.githistory
felipecaputo.git-project-manager
formulahendry.auto-close-tag
robertohuertasm.vscode-icons
samverschueren.final-newline
zhuangtongfa.Material-theme

and this is my config:

// Place your settings in this file to overwrite the default settings
{
    "gitProjectManager.baseProjectsFolders": [ "/Users/lironshmuel/Workspace" ]
,
"files.insertFinalNewline": true,
"npm-intellisense.packageSubfoldersIntellisense": true,
"javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": true,
"editor.fontSize": 13,
"editor.tabSize": 2,
"window.zoomLevel": 0,
"vsicons.projectDetection.autoReload": true,
"path-intellisense.mappings": {
    "/": "${workspaceRoot}/src"
}
}

trying to import a file from src directory (which located on root of the project) without success (trying to import from /myfile.js which is on my project root directory/src/myfile.js

[kib357]

@ChristianKohler i figured out that you can reproduce this issue by installing both path-intellisense and npm-intellisense.

[lironess]

I'm also having both packages, so this might be the problem .. (although you wrote them both 😆 )

[AvailCat]

mappings not work if npm-intellisense installed

[DollarAkshay]

having this issue without npm-intellisense installed

[rake5k]

Same problem here on Mac OS X Sierra. My settings.json:

{
    "path-intellisense.mappings": {
        ".": [
            "${workspaceRoot}/api/app",
            "${workspaceRoot}/web/app"
        ]
    }
}

The exact same mappings work like a charm on my Ubuntu 16.04 machine.

Side note: I even was excited that multiple paths are working by defining them in an array 👍

[iddan]

same here: trying to map my app/ directory to be used without prefix in my code:

{
    "path-intellisense.mappings": {
         "/": "${workspaceRoot}/app"
     }
}

both import '/' and import '' don't provide suggestions

[kuldeepkeshwar]

have anyone got any success on this ?

[Player1os]

had the same problem, the issue seems to be that as soon as you write anything other than '.', '..', '...', etc. as the prefix of the import path, npm-intellisense kicks in and overrides path-intellisense

so a quickfix for me was to to use this

"path-intellisense.mappings": {
	"...": "${workspaceRoot}"
},

that way import '.../src/index' triggers path-intellisense and npm-intellisense works fine on npm modules as well

PS: I used to use '#' as the mapping but I actually like '...' better now that I think about it ... it's closer to the '.' and '..' originally used to denote project specific modules in vanilla node.js require statements

[vanhtuan0409]

I think the problem comes from npm-IntelliSense

[Mr-Chilly]

Is there any joy with this? I found the {...} solution from @Player1os was the only thing to work - but that isn't actually useful for my needs...

[lucasbento]

@vanhtuan0409: that's not how OSS works, it's much better to send a PR than order maintainers to fix it.

[vanhtuan0409]

@lucasbento I am sorry. I don't mean to order anyone to do anything. My words are inappropriate.

[wesleymostien]

absolute mapping is not working either for me. Don't have npm intellisense extension...

[srg-kostyrko]

It seems that vscode's import path quick suggestions break mappings
After I added

"typescript.quickSuggestionsForPaths": false,

and with

"path-intellisense.mappings": {
     "@": "${workspaceRoot}/app"
 }

it started to provide correct suggestions for import from '@/'

[MadratJerry]

Disable npm intellisense extension and add

"typescript.quickSuggestionsForPaths": false,

it works for me now

[Ayc0]

does it still work with the last update ?

[hyposlasher]

it doesn't work with the last update. I didn't find "typescript.quickSuggestionsForPaths": false, anywhere in "settings"

[george-norris-salesforce]

I've uninstalled npm-intellisense and getting same error

[rardoz]

Removed npm-intellisense and there is no such thing as typescript.quickSuggestionsForPaths. Still getting the same issue.

[liesauer]

same issue and npm-intellisense isn't installed and there is no such thing as typescript.quickSuggestionsForPaths.

[lsalomon]

same here, vscode 1.43.2 on OSX 10.15.4, don't have npm intellisense, and yet any of the following configs is working :

    "path-intellisense.absolutePathToWorkspace": false,
    "path-intellisense.mappings": {
        "/": "/Users/laurent.salomon/Workspace/my-app/public"
    },

    "path-intellisense.absolutePathToWorkspace": true,
    "path-intellisense.mappings": {
        "/": "/Users/laurent.salomon/Workspace/my-app/public"
    },

    "path-intellisense.absolutePathToWorkspace": false,
    "path-intellisense.mappings": {
        "/": "${workspaceRoot}/public"
    },

    "path-intellisense.absolutePathToWorkspace": true,
    "path-intellisense.mappings": {
        "/": "${workspaceRoot}/public"
    },

    "path-intellisense.absolutePathToWorkspace": true,
    "path-intellisense.mappings": {
        "/": "public"
    },

[kenmarshall]

I got mine to work by disabling a few default path suggestions

    "typescript.suggest.paths": false,
    "javascript.suggest.paths": false,
    "path-intellisense.mappings": {
       "/": "${workspaceFolder}",
      "components" :  "${workspaceFolder}/client/src/components"
    },

Depending on which language you are working in you may have to disable the default setting {language}.suggest.paths
You can make the settings specific only to a workspace which makes it more convenient.

I didn't need to disable any other extension.

[zepvalue]

It may also be that is throttling a bit so maybe would help to disable the intellisense on certain paths in the settings.json

( especially node_modules!)

"files.watcherExclude": { "**/.git/objects/**": true, "**/.git/subtree-cache/**": true, "**/node_modules/*/**": true, "**/tmp/**": true, "**/dist/**": true, "**/public/**": true }

[ChristianKohler]

Thank you @zepvalue

Did you notice or measure that PathIntellisense has an issue with file watchers? Asking because mappings are not watched. But the extension has a single file watcher to check for changes in tsconfig files. But never heard of any problems with that one. 🤔

[zepvalue]

The only change I noticed was in the speed that PathIntellisense was indexing files. In react components with absolute path would take a bit before I forced the watchers options. I am not sure how the tsconfig works under the hood together with vscode