Broccoli Plugin

/**
 * Broccoli plugin for compiling HTMLBars templates to JavaScript modules
 * Extends broccoli-persistent-filter for caching and incremental builds
 */
class TemplateCompilerPlugin extends BroccoliFilter {
  /**
   * Create a new template compiler plugin
   * @param inputTree - Broccoli tree containing template files
   * @param options - Compilation options
   */
  constructor(inputTree: BroccoliTree, options?: TemplateCompilerOptions): TemplateCompilerPlugin;

  /**
   * Transform a template string to a JavaScript module
   * @param string - Template file content
   * @param relativePath - Path to the template file
   * @returns JavaScript module string
   */
  processString(string: string, relativePath: string): string;

  /**
   * Determine output path for transformed files
   * @param relativePath - Input file path
   * @returns Output file path or undefined to skip
   */
  getDestFilePath(relativePath: string): string | undefined;

  /** Base directory for plugin caching */
  baseDir(): string;
}

interface TemplateCompilerOptions {
  /** Enable persistent caching (default: true) */
  persist?: boolean;
  /** Production build flag */
  isProduction?: boolean;
  /** Template compiler configuration */
  templateCompiler?: object;
  /** AST plugin configuration */
  plugins?: {
    ast?: ASTPlugin[];
  };
  /** Plugin names for debugging */
  pluginNames?: string[];
  /** Cache invalidation settings */
  dependencyInvalidation?: boolean;
}

const TemplateCompilerPlugin = require('ember-cli-htmlbars').TemplateCompilerPlugin;
const mergeTrees = require('broccoli-merge-trees');

// Basic usage in custom build pipeline
const templateTree = new TemplateCompilerPlugin(inputTree, {
  isProduction: process.env.NODE_ENV === 'production',
  templateCompiler: require('./template-compiler'),
});

// Advanced usage with custom AST plugins
const advancedTemplateTree = new TemplateCompilerPlugin(inputTree, {
  plugins: {
    ast: [myCustomASTPlugin, anotherPlugin]
  },
  pluginNames: ['my-plugin', 'another-plugin'],
  dependencyInvalidation: true
});

// Static properties defining file handling
TemplateCompilerPlugin.prototype.extensions = ['hbs', 'handlebars'];
TemplateCompilerPlugin.prototype.targetExtension = 'js';

// Input: components/user-card.hbs
<div class="user-card">
  <h2>{{@user.name}}</h2>
  <p>{{@user.email}}</p>
</div>

// Output: components/user-card.js
import { hbs } from 'ember-cli-htmlbars';
export default hbs('<div class="user-card"><h2>{{@user.name}}</h2><p>{{@user.email}}</p></div>', { 
  moduleName: 'components/user-card.hbs' 
});

/**
 * Transpile a custom tree using ember-cli-htmlbars processing
 * Available on the addon instance for advanced build customization
 * @param inputTree - Broccoli tree to process
 * @param htmlbarsOptions - Template compilation options
 * @returns Processed Broccoli tree
 */
transpileTree(inputTree: BroccoliTree, htmlbarsOptions?: object): BroccoliTree;

// In ember-cli-build.js or addon index.js
const htmlbarsAddon = this.addons.find(addon => addon.name === 'ember-cli-htmlbars');
const customTemplateTree = htmlbarsAddon.transpileTree(someCustomTree, {
  isProduction: true,
  plugins: { ast: [myPlugin] }
});

// Plugin dependencies that affect caching
- Template compiler version changes
- AST plugin code changes (via baseDir() and cacheKey())
- Plugin configuration changes
- Dependency invalidation flags from AST plugins

// AST plugins can provide custom cache keys
const plugin = {
  name: 'my-transform',
  plugin: MyTransform,
  baseDir: () => __dirname,
  cacheKey: () => JSON.stringify(myConfiguration)
};