Visual Studio Code plugin that autocompletes filenames.

In the command palette (cmd-shift-p) select Install Extension and choose Path Intellisense.

To use Path Intellisense instead of the default autocompletion, the following configuration option must be added to your settings:

{ "typescript.suggest.paths": false }
{ "javascript.suggest.paths": false }

Use npm intellisense

Something missing? Found a bug? - Create a pull request or an issue. Github

Open in Gitpod

There is an issue on windows with the period key. See Issue ChristianKohler/NpmIntellisense#12

Add this to the keybinding:

{ "key": ".", "command": "" }

Pathintellisense uses the ts.config.compilerOptions.baseUrl as a mapping. So no need to define it twice. There is no support for paths at the moment.

For example:

# Folderstructure

src/
module-a
foo.ts
module-b

// tsconfig

{
	"baseUrl": "src",
}

would allow to type:

{
  import {} from "module-a/foo.ts";
}

You can disable this behaviour by setting it to true:

{
	"path-intellisense.ignoreTsConfigBaseUrl": true,
}

Path Intellisense removes the file extension by default if the statement is a import statement. To enable file extensions set the following setting to true:

{
	"path-intellisense.extensionOnImport": true,
}

Per default, hidden files are not displayed. Set this to true to show hidden files.

{
	"path-intellisense.showHiddenFiles": true,
}

If set to false, PathIntellisense ignores the default "files.exclude" as well:

{
	"files.exclude": {
		"**/*.map.js": true
	}
}

Per default, the autocompletion does not add a slash after a directory.

{
	"path-intellisense.autoSlashAfterDirectory": false,
}

When a suggestion was selected, the next suggestion will automatically pop up.

This setting will override the autoSlashAfterDirectory setting.

{
	"path-intellisense.autoTriggerNextSuggestion": false,
}

Per default, absolute paths are resolved within the current workspace root path. Set it to false to resolve absolute paths to the disk root path.

{
	"path-intellisense.absolutePathToWorkspace": true,
}

Define custom mappings which can be useful for using absolute paths or in combination with webpack resolve options.

{
	"path-intellisense.mappings": {
		"/": "${workspaceFolder}",
		"lib": "${workspaceFolder}/lib",
		"global": "/Users/dummy/globalLibs"
	},
}

Use ${workspaceFolder} when the path should be relative to the current root of the current project. V2.2.1 and lower used ${workspaceRoot}. Newer version support both placeholders.

See changelog

This software is released under MIT License