typescript-transform-paths

Transform module resolution paths in compiled output source to conform with

TypeScript

tsconfig.json

paths

rootDirs

baseUrl

Install

# NPM
npm i -D typescript-transform-paths

Yarn
yarn add -D typescript-transform-paths

Usage with ttypescript or ts-patch

Add it to plugins in your tsconfig.json

Example Config

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@utils/*": ["utils/*"]
    },
    "plugins": [
      // Transform paths in output .js files
      { "transform": "typescript-transform-paths" },

  // Transform paths in output .d.ts files (Include this line if you output declarations files)
  { "transform": "typescript-transform-paths", "afterDeclarations": true }
]
  }
}

core/index.ts

tsx
import { sum } from "@utils/sum";
sum(2, 3);

core/index.js

js
// core/index.js
var sum_1 = require("../utils/sum");
sum_1.sum(2, 3);

Virtual Directories

TS allows defining virtual directories via the

rootDirs

useRootDirs

{
  "compilerOptions": {
    "rootDirs": [ "src", "generated" ],
    "baseUrl": ".",
    "paths": {
      "#root/*": [ "./src/*", "./generated/*" ]
    },
    "plugins": [
      { "transform": "typescript-transform-paths", "useRootDirs": true },
      { "transform": "typescript-transform-paths", "useRootDirs": true, "afterDeclarations": true }
    ]
  }
}

Example

- src/
    - subdir/
      - sub-file.ts
    - file1.ts
- generated/
    - file2.ts

src/file1.ts

ts
import '#root/file2.ts' // resolves to './file2'

src/subdir/sub-file.ts

ts
import '#root/file2.ts' // resolves to '../file2'
import '#root/file1.ts' // resolves to '../file1'

Custom Control

Exclusion patterns

You can disable transformation for paths based on the resolved file path. The

exclude

For an example context in which this would be useful, see Issue #83

Example:

jsonc
{
  "compilerOptions": {
    "paths": {
      "sub-module1/*": [ "../../node_modules/sub-module1/*" ],
      "sub-module2/*": [ "../../node_modules/sub-module2/*" ],
    },
    "plugins": [
      { 
        "transform": "typescript-transform-paths", 
        "exclude": [ "**/node_modules/**" ]
      }
    ]
  }
}

// This path will not be transformed
import * as sm1 from 'sub-module1/index'

@transform-path tag

Use the

@transform-path

// @transform-path https://cdnjs.cloudflare.com/ajax/libs/react/17.0.1/umd/react.production.min.js
import react from 'react' // Output path will be the url above

@no-transform-path

Use the

@no-transform-path

// @no-transform-path
import 'normally-transformed' // This will remain 'normally-transformed', even though it has a different value in paths config

Articles

• Node Consumable Modules With Typescript Paths by oleersoy

Project Guidelines for Contributors

• Package Manager:

  yarn

  (

  yarn install

  )
• Commit messages: Conventional Commit Specs
• Format before commit:

  prettier

  (

  yarn run format

  )
• Releases:

  standard-version

  (

  yarn run release

  )

Maintainers

Ron S.

Daniel Perez Alvarez

Contributors

Thanks goes to these wonderful people (emoji key):

Daniel Perez Alvarez 💻 🚧 ⚠️	Михайлов Антон 💻 🐛 ⚠️	Joshua Avalon 🐛 📦	Robert Laverty 🐛 ⚠️	Ole Ersoy 🐛 📝	sbmw 🐛	richardspence 🐛
Vitaly Pinchuk 🐛	laij84 🐛	dko-slapdash 🐛	hedwiggggg 🐛 ⚠️ 💻	kuskoman 📖	alex weidner 🐛	Ron S. 🐛 ⚠️ 💻
Vladimir Yakovlev 🐛	vwpo 🐛

This project follows the all-contributors specification. Contributions of any kind welcome!