gulp-ts-alias-plus
v1.1.0
Published
Use Gulp to resolve Typescript path aliases during compilation.
Downloads
4
Maintainers
Readme
gulp-ts-alias-plus
Forked of gulp-ts-alias
Support multiple imports on the same line.
Install
npm i -D gulp-ts-alias-plus
# yarn add -D gulp-ts-alias-plus
Usage
const typescript = require('gulp-typescript');
const sourcemaps = require('gulp-sourcemaps');
const alias = require('gulp-ts-alias');
const project = typescript.createProject('tsconfig.json');
function build() {
const compiled = src('./src/**/*.ts')
.pipe(alias({ configuration: project.config }))
.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/'))
}
Example
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';