What is tsc-alias?
The tsc-alias npm package is a tool designed to resolve and replace path aliases in the compiled JavaScript files generated by the TypeScript compiler. It is particularly useful for projects that use path aliases in their TypeScript configuration (tsconfig.json) to simplify module imports.
What are tsc-alias's main functionalities?
Path Alias Resolution
This command resolves and replaces path aliases in the compiled JavaScript files based on the configuration specified in the tsconfig.json file. It ensures that the path aliases used in TypeScript are correctly translated to relative paths in the output JavaScript.
tsc-alias -p tsconfig.json
Custom Configuration
This command allows you to specify a custom configuration file for tsc-alias. This is useful if you have a separate configuration for alias resolution that differs from your main tsconfig.json.
tsc-alias -p tsconfig.json --config custom-config.json
Watch Mode
This command runs tsc-alias in watch mode, which means it will continuously monitor your TypeScript files for changes and automatically resolve path aliases in the compiled JavaScript files whenever a change is detected.
tsc-alias -p tsconfig.json --watch
Other packages similar to tsc-alias
module-alias
The module-alias package allows you to register and use custom module paths in Node.js. It is similar to tsc-alias in that it helps manage module paths, but it is not specifically designed for TypeScript and does not integrate with the TypeScript compiler.
babel-plugin-module-resolver
The babel-plugin-module-resolver package is a Babel plugin that allows you to alias module paths in your JavaScript code. It is similar to tsc-alias in that it helps manage module paths, but it is designed to work with Babel rather than the TypeScript compiler.
tsconfig-paths
The tsconfig-paths package is a tool that helps resolve TypeScript path aliases at runtime. It is similar to tsc-alias in that it works with TypeScript path aliases, but it focuses on runtime resolution rather than compile-time resolution.
tsc-alias
Replace alias paths with relative paths after typescript compilation. You can add aliases that reference other projects outside your tsconfig.json project by providing a relative path to the baseUrl.
+ Compile time (no runtime dependencies)
Getting Started
First, install tsc-alias as devDependency using npm.
npm install -g tsc-alias
npm install --save-dev tsc-alias
Add it to your build scripts in package.json
"scripts": {
"build": "tsc --project tsconfig.json && tsc-alias -p tsconfig.json",
}
================ OR ===================
"scripts": {
"build": "tsc && tsc-alias",
"build:watch": "tsc && (concurrently \"tsc -w\" \"tsc-alias -w\")"
}
Issues
If you have an issue, please create one. But, before:
- try to check the FAQ.
- try to check if there exits alike issues.
- try to run with
--debug
and check if config is correctly loaded and all sourcefiles are found.
API
Installation
npm install tsc-alias
Usage
import { replaceTscAliasPaths } from 'tsc-alias';
replaceTscAliasPaths(options?);
Here are all the available options:
Option | Description | Default Value |
---|
project, p | path to tsconfig.json | 'tsconfig.json' |
watch | Observe file changes | false |
outDir | Run in a folder leaving the "outDir" of the tsconfig.json (relative path to tsconfig) | tsconfig.compilerOptions.outDir |
declarationDir | Works the same as outDir but for declarationDir | tsconfig.compilerOptions.declarationDir |
resolveFullPaths | Attempt to replace incomplete import paths (those not ending in .js ) with fully resolved paths (for ECMAScript Modules compatibility) | false |
resolveFullExtension | Allows you to specify the extension of incomplete import paths, works with resolveFullPaths | '.js' | '.mjs' | '.cjs' |
silent | Reduced terminal output. This is a deprecated option and no longer has any effect. | true |
verbose | Additional information is output to the terminal | false |
debug | Debug information is send to the terminal | false |
replacers | Files to import as extra replacers More info | [] |
output | The output object tsc-alias will send logs to. | new Output(options.verbose) |
fileExtensions | Overwrite file extensions tsc-alias will use to scan and resolve files. | undefined |
Configuration via tsconfig.json
Example
{
"compilerOptions": {
...
},
"tsc-alias": {
"verbose": false,
"resolveFullPaths": true,
"replacers": {
"exampleReplacer": {
"enabled": true,
"file": "./exampleReplacer.js"
},
"otherReplacer": {
"enabled": true,
"file": "./otherReplacer.js"
}
},
"fileExtensions": {
"inputGlob": "{js,jsx,mjs}",
"outputCheck": ["js", "json", "jsx", "mjs"]
}
}
}
Single file replacer
We can use tsc-alias in a single file, with a function that returns the modified contents.
We prepare the replacer with prepareSingleFileReplaceTscAliasPaths()
, passing the same options that we would pass to replaceTscAliasPaths()
. That will return a promise of a function that receives the file contents and path, and returns the transformed contents, synchronously.
import { prepareSingleFileReplaceTscAliasPaths } from 'tsc-alias';
const runFile: SingleFileReplacer = await prepareSingleFileReplaceTscAliasPaths(options?);
function treatFile(filePath: string) {
const fileContents = fs.readFileSync(filePath, 'utf8');
const newContents = runFile({fileContents, filePath});
}