Webpack plugin that AoT compiles your Angular components and modules.
—
Pending
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Pending
The risk profile of this skill
Advanced TypeScript compilation system with host augmentation for Angular-specific requirements including dependency collection, resource loading, and file replacements.
Augments TypeScript compiler host with resource loading capabilities for Angular templates and stylesheets.
/**
* Augments TypeScript compiler host with resource loading capabilities
* Enables loading of Angular component templates and stylesheets
* @param host - Base TypeScript compiler host
* @param resourceLoader - Webpack resource loader instance
* @param options - Resource loading options
*/
function augmentHostWithResources(
host: ts.CompilerHost,
resourceLoader: WebpackResourceLoader,
options?: {
directTemplateLoading?: boolean;
inlineStyleFileExtension?: string;
}
): void;Augments compiler host to collect and track file dependencies during compilation.
/**
* Augments host to collect dependencies during compilation
* Tracks file dependencies for webpack's dependency graph
* @param host - Base TypeScript compiler host
* @param dependencies - Map storing file dependencies
* @param moduleResolutionCache - Optional cache for resolved modules
*/
function augmentHostWithDependencyCollection(
host: ts.CompilerHost,
dependencies: Map<string, Set<string>>,
moduleResolutionCache?: ts.ModuleResolutionCache
): void;Augments compiler host with file replacement capabilities for environment-specific builds.
/**
* Augments host with file replacement capabilities
* Enables swapping files during compilation (e.g., environment configs)
* @param host - Base TypeScript compiler host
* @param replacements - Map of file paths to replacement paths
* @param moduleResolutionCache - Optional cache for resolved modules
*/
function augmentHostWithReplacements(
host: ts.CompilerHost,
replacements: Record<string, string>,
moduleResolutionCache?: ts.ModuleResolutionCache
): void;Augments compiler host with string substitution capabilities for build-time constants.
/**
* Augments host with string substitution capabilities
* Enables replacing string literals during compilation
* @param host - Base TypeScript compiler host
* @param substitutions - Map of strings to replacement values
*/
function augmentHostWithSubstitutions(
host: ts.CompilerHost,
substitutions: Record<string, string>
): void;Adds versioning support to TypeScript programs for incremental compilation.
/**
* Adds versioning support to TypeScript programs
* Enables incremental compilation and change detection
* @param program - TypeScript program to augment
*/
function augmentProgramWithVersioning(program: ts.Program): void;Augments compiler host with caching capabilities for improved build performance.
/**
* Augments host with caching capabilities
* Improves compilation performance through source file caching
* @param host - Base TypeScript compiler host
* @param cache - Source file cache map
*/
function augmentHostWithCaching(
host: ts.CompilerHost,
cache: Map<string, ts.SourceFile>
): void;Cache system for TypeScript source files to improve compilation performance.
/**
* Cache for TypeScript source files
* Extends Map with additional caching functionality for Angular diagnostics
*/
class SourceFileCache extends Map<string, ts.SourceFile> {
/**
* Invalidates cached entries for a specific file
* @param file - Path of file to invalidate
*/
invalidate(file: string): void;
/**
* Updates Angular diagnostics for a source file
* @param sourceFile - TypeScript source file
* @param diagnostics - Array of diagnostics to store
*/
updateAngularDiagnostics(sourceFile: ts.SourceFile, diagnostics: ts.Diagnostic[]): void;
/**
* Gets Angular diagnostics for a source file
* @param sourceFile - TypeScript source file
* @returns Array of diagnostics or undefined
*/
getAngularDiagnostics(sourceFile: ts.SourceFile): ts.Diagnostic[] | undefined;
}Creates TypeScript system from webpack's file system for seamless integration.
/**
* Type for webpack input file system
* Represents webpack's file system interface
*/
type InputFileSystem = NonNullable<Compiler['inputFileSystem']>;
/**
* Synchronous file system interface
* Extends webpack's file system with synchronous operations
*/
interface InputFileSystemSync extends InputFileSystem {
/** Synchronously get file statistics */
statSync(path: string): { isFile(): boolean; isDirectory(): boolean };
/** Synchronously read file content */
readFileSync(path: string, encoding?: string): string | Buffer;
}
/**
* Creates TypeScript system from webpack file system
* Bridges webpack's file system with TypeScript compiler
* @param inputFileSystem - Webpack input file system
* @param currentDirectory - Current working directory
* @returns TypeScript system interface
*/
function createWebpackSystem(
inputFileSystem: InputFileSystemSync,
currentDirectory: string
): ts.System;System for handling and reporting TypeScript and Angular compilation diagnostics.
/**
* Function type for reporting diagnostics
* Handles TypeScript and Angular compilation diagnostics
*/
type DiagnosticsReporter = (diagnostics: readonly Diagnostic[]) => void;
/**
* Creates a diagnostics reporter for webpack compilations
* Integrates TypeScript diagnostics with webpack's error reporting
* @param compilation - Webpack compilation instance
* @param sourceFileToUrl - Function to convert file paths to URLs
* @returns Diagnostics reporter function
*/
function createDiagnosticsReporter(
compilation: Compilation,
sourceFileToUrl?: (sourceFile: string) => string
): DiagnosticsReporter;
/**
* Adds warning message to webpack compilation
* @param compilation - Webpack compilation instance
* @param message - Warning message to add
*/
function addWarning(compilation: Compilation, message: string): void;
/**
* Adds error message to webpack compilation
* @param compilation - Webpack compilation instance
* @param message - Error message to add
*/
function addError(compilation: Compilation, message: string): void;Cross-platform path normalization and externalization utilities.
/**
* Normalizes file paths for cross-platform compatibility
* Converts paths to use forward slashes consistently
* @param path - File path to normalize
* @returns Normalized path string
*/
function normalizePath(path: string): string;
/**
* Externalizes paths for different operating systems
* Handles platform-specific path requirements
*/
const externalizePath: (path: string) => string;Example showing how all host augmentations work together:
import {
augmentHostWithResources,
augmentHostWithDependencyCollection,
augmentHostWithReplacements,
augmentHostWithSubstitutions,
augmentHostWithCaching,
SourceFileCache,
WebpackResourceLoader
} from '@ngtools/webpack';
// Create base TypeScript compiler host
const baseHost = ts.createCompilerHost(compilerOptions);
// Create resource loader and cache
const resourceLoader = new WebpackResourceLoader();
const cache = new SourceFileCache();
const dependencies = new Map<string, Set<string>>();
const moduleResolutionCache = new Map<string, ts.ResolvedModule>();
// Apply all augmentations
let augmentedHost = augmentHostWithResources(baseHost, resourceLoader, options);
augmentedHost = augmentHostWithDependencyCollection(augmentedHost, dependencies, moduleResolutionCache);
augmentedHost = augmentHostWithReplacements(augmentedHost, fileReplacements, moduleResolutionCache);
augmentedHost = augmentHostWithSubstitutions(augmentedHost, substitutions);
augmentedHost = augmentHostWithCaching(augmentedHost, cache);
// Use augmented host for Angular compilation
const program = ts.createProgram(fileNames, compilerOptions, augmentedHost);