or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

configuration.mderror-handling.mdindex.mdintegration.mdinternal-api.md
tile.json

tessl/npm-tsify

Browserify plugin for compiling TypeScript files with seamless integration and incremental compilation support

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/tsify@5.0.x

To install, run

npx @tessl/cli install tessl/npm-tsify@5.0.0

index.mddocs/

tsify

tsify is a Browserify plugin that compiles TypeScript files directly within the Browserify bundling process. It provides seamless integration between TypeScript's compiler and Browserify's module system, performing a single compilation pass of all TypeScript source files before bundling for optimal performance and complete type checking.

Package Information

  • Package Name: tsify
  • Package Type: npm
  • Language: JavaScript/TypeScript
  • Installation: npm install tsify

Core Imports

const tsify = require('tsify');

For TypeScript projects with type definitions:

import tsify = require('tsify');

Basic Usage

Browserify API

const browserify = require('browserify');
const tsify = require('tsify');

browserify()
  .add('main.ts')
  .plugin(tsify, { noImplicitAny: true })
  .bundle()
  .on('error', function (error) { console.error(error.toString()); })
  .pipe(process.stdout);

Command Line

browserify main.ts -p [ tsify --noImplicitAny ] > bundle.js

With tsconfig.json

tsify automatically detects and uses tsconfig.json files:

browserify()
  .add('src/main.ts')
  .plugin(tsify)  // Automatically uses tsconfig.json
  .bundle()
  .pipe(fs.createWriteStream('dist/bundle.js'));

Architecture

tsify is built around several key components:

  • Plugin Interface: Integrates with Browserify's plugin system to add TypeScript compilation
  • Tsifier: Core compilation orchestrator that manages TypeScript compilation and caching
  • Host: Virtual file system implementation that manages TypeScript source files in memory
  • Transform Stream: Stream transformer that processes TypeScript files during bundling
  • Error Handling: Comprehensive error reporting with TypeScript-specific diagnostics

Capabilities

Main Plugin Function

Core plugin interface for registering tsify with Browserify to enable TypeScript compilation.

function tsify(browserifyInstance: any, options: TsifyOptions): void;

Configuration

TypeScript Compilation

Internal compilation engine that orchestrates TypeScript processing and manages file transformations.

class Tsifier extends EventEmitter {
  reset(): void;
  generateCache(files: string[], ignoredFiles?: string[]): void;
  compile(): void;
}

Internal API

Error Handling

Comprehensive error reporting system for TypeScript compilation diagnostics with detailed location information.

class CompileError extends SyntaxError {
  fileName?: string;
  line?: number;
  column?: number;
}

Error Handling

Build Tool Integration

Seamless integration with popular build tools and development workflows including watchify, Gulp, and Grunt.

/** Integration with watchify for incremental compilation */
const watchify = require('watchify');
/** Integration with Gulp for build pipelines */
const gulp = require('gulp');

Build Tool Integration

Types

interface TsifyOptions {
  /** Files/patterns to exclude from compilation */
  exclude?: string[];
  /** Explicit list of files to compile */
  files?: string[];
  /** Whether to set up as global transform */
  global?: boolean;
  /** Files/patterns to include in compilation */
  include?: string[];
  /** Short form for module option */
  m?: string;
  /** Short form for project option */
  p?: string | Record<string, any>;
  /** Path to tsconfig.json file or directory, or inline tsconfig object */
  project?: string | Record<string, any>;
  /** Short form for target option */
  t?: string;
  /** Custom TypeScript compiler reference */
  typescript?: string | typeof import('typescript');
  
  // All TypeScript compiler options are also supported
  [key: string]: any;
}