Comprehensive build optimizer that analyzes AMD dependencies, combines modules, and applies minification for production deployment.
Define build targets, optimization settings, and output configuration.
/**
* Main build configuration object
*/
interface BuildConfig {
/** Source application directory to copy from */
appDir?: string;
/** Base URL for module resolution */
baseUrl?: string;
/** Output directory for built files */
dir?: string;
/** Array of module build configurations */
modules?: ModuleConfig[];
/** Single module build (alternative to modules array) */
name?: string;
out?: string;
/** Path mappings for module names */
paths?: { [key: string]: string };
/** Package configurations */
packages?: PackageConfig[];
/** Files to exclude from build */
fileExclusionRegExp?: RegExp;
/** Directories to exclude from build */
dirExclusionRegExp?: RegExp;
/** JavaScript optimization method */
optimize?: "uglify" | "closure" | "none";
/** CSS optimization method */
optimizeCss?: "standard" | "standard.keepLines" | "standard.keepComments" | "none";
/** Inline text plugin resources */
inlineText?: boolean;
/** Preserve license comments in optimized files */
preserveLicenseComments?: boolean;
/** Build-time pragma configuration */
pragmas?: { [key: string]: boolean };
/** Skip pragma processing */
skipPragmas?: boolean;
/** Find nested require() calls in non-AMD code */
findNestedDependencies?: boolean;
/** Remove combined files after build */
removeCombined?: boolean;
/** Optimize all plugin resources */
optimizeAllPluginResources?: boolean;
/** Wrap built code with start/end text */
wrap?: {
start: string;
end: string;
} | {
startFile: string;
endFile: string;
} | boolean;
/** Add namespace to define() calls */
namespace?: string;
/** Modules to preserve from optimization (usually plugins) */
stubModules?: string[];
/** Build lifecycle callbacks */
onBuildRead?(moduleName: string, path: string, contents: string): string;
onBuildWrite?(moduleName: string, path: string, contents: string): string;
}
interface ModuleConfig {
/** Module name/path */
name: string;
/** Modules to include in this build */
include?: string[];
/** Modules to exclude from this build */
exclude?: string[];
/** Create module even if no dependencies found */
create?: boolean;
/** Add require() calls for these modules */
insertRequire?: string[];
/** Override output path for this module */
out?: string;
}Usage Examples:
// build.js - Single module build
({
baseUrl: "scripts",
name: "main",
out: "scripts/main-built.js",
optimize: "uglify",
preserveLicenseComments: false
})
// Multi-module build with app directory
({
appDir: "src",
baseUrl: "scripts",
dir: "dist",
modules: [
{
name: "main",
exclude: ["jquery"]
},
{
name: "admin/main",
include: ["admin/users", "admin/reports"]
}
],
paths: {
"jquery": "lib/jquery-1.8.2.min"
},
optimize: "uglify"
})
// CSS optimization build
({
appDir: "src",
dir: "dist",
baseUrl: "js",
optimizeCss: "standard.keepLines",
modules: [
{ name: "main" }
]
})Analyze AMD dependencies and create build graphs.
/**
* Dependency analysis results
*/
interface DependencyAnalysis {
/** All discovered modules */
modules: string[];
/** Dependency graph */
dependencies: { [module: string]: string[] };
/** Circular dependencies found */
circular: string[][];
/** Plugin resources */
pluginResources: { [plugin: string]: string[] };
/** Non-AMD files requiring shim */
shimmed: string[];
}
/**
* Build layer information
*/
interface BuildLayer {
/** Layer name */
name: string;
/** Included modules */
modules: string[];
/** Layer file size */
size: number;
/** Optimization applied */
optimized: boolean;
}Usage Examples:
// Build configuration with dependency analysis
({
baseUrl: "app",
name: "main",
out: "build/main.js",
// Find all nested dependencies
findNestedDependencies: true,
// Include common dependencies
include: [
"common/utils",
"common/ajax"
],
// Exclude libraries loaded separately
exclude: [
"jquery",
"backbone"
],
// Trace path for debugging
logLevel: 0,
onBuildRead: function(moduleName, path, contents) {
console.log("Processing:", moduleName);
return contents;
},
onBuildWrite: function(moduleName, path, contents) {
console.log("Writing:", moduleName, "Size:", contents.length);
return contents;
}
})Configure JavaScript and CSS minification and optimization.
/**
* UglifyJS optimization configuration
*/
interface UglifyConfig {
/** Optimization level */
optimize: "uglify";
/** UglifyJS-specific options */
uglify?: {
/** Mangle variable names */
mangle?: boolean;
/** Remove dead code */
dead_code?: boolean;
/** Compress expressions */
squeeze?: boolean;
/** Beautify output */
beautify?: boolean;
/** Maximum line length */
max_line_len?: number;
};
}
/**
* Google Closure Compiler configuration
*/
interface ClosureConfig {
/** Optimization level */
optimize: "closure";
/** Closure Compiler options */
closure?: {
/** Compilation level */
compilation_level?: "WHITESPACE_ONLY" | "SIMPLE_OPTIMIZATIONS" | "ADVANCED_OPTIMIZATIONS";
/** Language input */
language_in?: "ECMASCRIPT3" | "ECMASCRIPT5" | "ECMASCRIPT5_STRICT";
/** Warning level */
warning_level?: "QUIET" | "DEFAULT" | "VERBOSE";
};
}
/**
* CSS optimization configuration
*/
interface CssOptimizeConfig {
/** CSS optimization method */
optimizeCss: "standard" | "standard.keepLines" | "standard.keepComments" | "none";
/** CSS import handling */
cssImportIgnore?: string;
}Usage Examples:
// UglifyJS optimization
({
baseUrl: "src",
name: "main",
out: "dist/main.js",
optimize: "uglify",
uglify: {
mangle: true,
dead_code: true,
beautify: false,
max_line_len: 1000
},
preserveLicenseComments: true
})
// Closure Compiler optimization
({
baseUrl: "src",
name: "main",
out: "dist/main.js",
optimize: "closure",
closure: {
compilation_level: "SIMPLE_OPTIMIZATIONS",
language_in: "ECMASCRIPT5",
warning_level: "DEFAULT"
}
})
// CSS optimization
({
appDir: "src",
dir: "dist",
baseUrl: "js",
optimizeCss: "standard.keepLines",
cssImportIgnore: "normalize.css",
modules: [
{ name: "main" }
]
})Handle RequireJS plugins during build process.
/**
* Plugin build configuration
*/
interface PluginBuildConfig {
/** Inline all plugin resources */
inlineText?: boolean;
/** Optimize all plugin resources */
optimizeAllPluginResources?: boolean;
/** Plugin-specific build handling */
pluginBuildHandlers?: {
[pluginName: string]: PluginBuildHandler;
};
}
interface PluginBuildHandler {
/** Write plugin resource inline */
writeFile?(pluginName: string, moduleName: string, req: any, write: Function): void;
}
/**
* Common plugins and their build behavior
*/
interface CommonPlugins {
/** Text plugin - inline templates/text files */
"text": {
/** File extensions to process */
extensions: string[];
/** Whether to inline during build */
inline: boolean;
};
/** i18n plugin - internationalization */
"i18n": {
/** Locale to build for */
locale: string;
/** Available locales */
availableLocales: string[];
};
/** CSS plugin - load CSS files */
"css": {
/** Whether to inline CSS */
inline: boolean;
/** CSS optimization */
optimize: boolean;
};
}Usage Examples:
// Text plugin inlining
({
baseUrl: "src",
name: "main",
out: "dist/main.js",
inlineText: true,
// Modules using text plugin
paths: {
"text": "lib/require-text"
}
})
// Custom plugin handling
({
baseUrl: "src",
name: "main",
out: "dist/main.js",
optimizeAllPluginResources: true,
pluginBuildHandlers: {
"myPlugin": {
writeFile: function(pluginName, moduleName, req, write) {
// Custom plugin build logic
var processed = processMyPlugin(moduleName);
write(moduleName, processed);
}
}
}
})Use build-time conditionals to include/exclude code.
/**
* Pragma configuration
*/
interface PragmaConfig {
/** Pragma values */
pragmas?: { [key: string]: boolean };
/** Skip all pragma processing */
skipPragmas?: boolean;
/** Custom pragma processors */
pragmasOnSave?: { [key: string]: Function };
}
/**
* Pragma syntax in source code
*/
interface PragmaSyntax {
/** Conditional inclusion */
">>includeStart(\"pragmaName\", pragmaValue)": void;
">>includeEnd(\"pragmaName\")": void;
/** Conditional exclusion */
">>excludeStart(\"pragmaName\", pragmaValue)": void;
">>excludeEnd(\"pragmaName\")": void;
}Usage Examples:
// Build configuration with pragmas
({
baseUrl: "src",
name: "main",
out: "dist/main.js",
pragmas: {
production: true,
debug: false,
experimental: false
}
})
// Source code with pragmas
define(function() {
var api = {
version: "1.0.0"
};
//>>includeStart("debug", pragmas.debug)
api.debug = function(msg) {
console.log("DEBUG:", msg);
};
//>>includeEnd("debug")
//>>excludeStart("production", pragmas.production)
// Development-only code
api.mockData = { /* mock data */ };
//>>excludeEnd("production")
return api;
});Hook into the build process for custom processing.
/**
* Build lifecycle hooks
*/
interface BuildHooks {
/** Called when reading a module file */
onBuildRead?(moduleName: string, path: string, contents: string): string;
/** Called when writing a built file */
onBuildWrite?(moduleName: string, path: string, contents: string): string;
/** Called after build completion */
onBuildComplete?(data: BuildSummary): void;
}
interface BuildSummary {
/** Build statistics */
modules: number;
totalSize: number;
optimizedSize: number;
compressionRatio: number;
/** Build timing */
startTime: Date;
endTime: Date;
duration: number;
/** Error/warning information */
errors: string[];
warnings: string[];
}Usage Examples:
// Build with lifecycle hooks
({
baseUrl: "src",
name: "main",
out: "dist/main.js",
onBuildRead: function(moduleName, path, contents) {
console.log("Reading:", moduleName);
// Add custom transformations
if (moduleName.endsWith("config")) {
contents = contents.replace(/ENVIRONMENT/g, "production");
}
return contents;
},
onBuildWrite: function(moduleName, path, contents) {
console.log("Writing:", moduleName, "(" + contents.length + " bytes)");
// Add banner comment
if (moduleName === "main") {
contents = "/*! Built: " + new Date().toISOString() + " */\n" + contents;
}
return contents;
},
onBuildComplete: function(data) {
console.log("Build completed!");
console.log("Modules:", data.modules);
console.log("Original size:", data.totalSize);
console.log("Optimized size:", data.optimizedSize);
console.log("Compression:", Math.round(data.compressionRatio * 100) + "%");
if (data.errors.length > 0) {
console.error("Errors:", data.errors);
}
}
})Complex build configurations for large applications.
/**
* Multi-layer build configuration
*/
interface MultiLayerBuild {
/** Common/shared layer */
common: ModuleConfig;
/** Application-specific layers */
apps: ModuleConfig[];
/** Library layers */
libs: ModuleConfig[];
}
/**
* Conditional builds
*/
interface ConditionalBuild {
/** Environment-specific configurations */
environments: {
[env: string]: Partial<BuildConfig>;
};
/** Feature flags */
features: {
[feature: string]: boolean;
};
}Usage Examples:
// Multi-layer architecture
({
appDir: "src",
baseUrl: "js",
dir: "dist",
modules: [
// Common libraries layer
{
name: "common",
include: [
"jquery",
"underscore",
"backbone",
"common/utils",
"common/models"
]
},
// Main application layer
{
name: "app/main",
exclude: ["common"]
},
// Admin panel layer
{
name: "admin/main",
exclude: ["common"]
},
// Mobile-specific layer
{
name: "mobile/main",
exclude: ["common"],
include: ["mobile/touch", "mobile/geo"]
}
]
})
// Environment-specific builds
var config = {
baseUrl: "src",
name: "main",
paths: {
"config": "config/base"
}
};
// Override for production
if (process.env.NODE_ENV === "production") {
config.out = "dist/main.min.js";
config.optimize = "uglify";
config.paths.config = "config/production";
config.pragmas = {
production: true,
debug: false
};
} else {
config.out = "dist/main.js";
config.optimize = "none";
config.paths.config = "config/development";
config.pragmas = {
production: false,
debug: true
};
}
// Export configuration
module.exports = config;// Build result types
interface BuildResult {
success: boolean;
modules: string[];
layers: BuildLayer[];
errors: BuildError[];
warnings: string[];
stats: BuildStats;
}
interface BuildError {
type: "dependency" | "syntax" | "plugin" | "file";
module: string;
message: string;
line?: number;
column?: number;
}
interface BuildStats {
totalModules: number;
totalSize: number;
optimizedSize: number;
compressionRatio: number;
buildTime: number;
}
// File processing types
interface FileProcessor {
(content: string, path: string, config: BuildConfig): string;
}
interface ModuleTransform {
(moduleContent: string, moduleName: string): string;
}