typescript-plugin-tsconfig-paths

typescript-plugin-tsconfig-paths

A typescript language service plugin that allows typescript paths to be used with all extensions.

Before:

After:

Table of contents

• typescript-plugin-tsconfig-paths
  • Table of contents
  • About this plugin
  • Installation
  • Options
    • extensions
  • Visual Studio Code

About this plugin

A typescript language service plugin that allows all extensions to use typescript paths. created because Typescript only implemented Tsconfig paths for typescript files only.

Note this plugin works within tsserver, it does not work within tsc and requires a separate alias setting in a bundler such as Webpack!

Installation

To install with npm:

npm install -D typescript-plugin-tsconfig-paths

To install with yarn;

yarn add -D typescript-plugin-tsconfig-paths

Once installed, add this plugin to your tsconfig.json:

{
    "compilerOptions": {
        "plugins": [{ "name": "typescript-plugin-tsconfig-paths" }]
    }
}

Options

Option	Default value	Description
extensions	[".ts", ".tsx"]	If a module does not have an extension, it will automatically attempt to add one, starting with the previous element.

Visual Studio Code

To activate this plugin in Visual Studio Code, put the following in .vscode/settings.json to change the behavior so that Vscode uses the Typescript of the workspace.

{
    "typescript.tsdk": "node_modules/typescript/lib"
}