Resolve TypeScript import aliases and paths defined in tsconfig.

npm install --save-dev @gulp-plugin/alias

• Supports all import types: import, require, await import()
• Supports wild card aliases

There have been previous attempts at releasing Gulp plugins that accomplish something similar, but all have become unmaintained.

For legacy’s sake, here is a list of previous packages/scripts that have been considered:

gulp-ts-paths

path-alias-resolver

Note: Imports within multiline comments may also be replaced.

const typescript = require('gulp-typescript'); const sourcemaps = require('gulp-sourcemaps'); const alias = require('@gulp-plugin/alias'); const { config } = typescript.createProject('tsconfig.json'); function build() { const compiled = src('./src/**/*.ts') .pipe(alias(config)) // or .pipe(alias('tsconfig.json')) // or even .pipe(alias()) .pipe(sourcemaps.init()) .pipe(project()); return compiled.js .pipe(sourcemaps.write({ sourceRoot: file => path.relative(path.join(file.cwd, file.path), file.base) })) .pipe(dest('build/')) }

The following configuration is common in tsconfig configuration files

{ "rootDir": "./src", "baseUrl": ".", "paths": { "@/*": ["src/*"] } }

In practice, these path aliases are often used in this fashion

Input:

import express from 'express'; import A from './file'; // Normal relative import // Aliased import, resolves to some relative path to rootDir import B from '@/components';

Output:

import express from 'express'; import A from './file'; // gulp-ts-alias finds the correct relative path // and replaces it before compilation import B from '../../components';