or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

configuration.mdcore-api.mddynamic-imports.mdember-addon.mdindex.md
tile.json

ember-addon.mddocs/

Ember Addon Integration

Core Ember CLI addon functionality providing automatic NPM package importing without configuration. The addon integrates seamlessly into Ember's build pipeline and requires no setup beyond installation.

Capabilities

Main Addon Module

The default export is an Ember addon object that implements standard Ember CLI lifecycle hooks.

/**
 * Main Ember addon module export
 * Standard Ember CLI addon with auto-import functionality
 */
module.exports = {
  /** Package name from package.json */
  name: string;
  
  /** 
   * Ember addon initialization hook
   * Registers this addon instance with AutoImport leader election
   */
  init(...args: any[]): void;
  
  /**
   * Sets up the import analyzer in Ember's build pipeline
   * Registers a JavaScript preprocessor to analyze imports
   */
  setupPreprocessorRegistry(type: string, registry: any): void;
  
  /**
   * Ember addon included hook
   * Installs babel plugin and configures build settings
   */
  included(...args: unknown[]): void;
  
  /**
   * Register an Embroider v2 addon for compatibility
   * Called by @embroider/addon-shim for v2 addon support
   */
  registerV2Addon(packageName: string, packageRoot: string): void;
  
  /**
   * Returns the AutoImport leader instance
   * Used for coordination between multiple addon instances
   */
  leader(): AutoImportSharedAPI;
  
  /**
   * Post-process the build tree to add auto-import bundles
   * Adds webpack-generated bundles to the final output
   */
  postprocessTree(which: string, tree: Node): Node;
}

Usage Example:

// The addon is automatically loaded when installed
// No manual configuration required in most cases

// Optional configuration in ember-cli-build.js
let app = new EmberApp(defaults, {
  autoImport: {
    // Custom configuration options
    exclude: ['some-package'],
    alias: {
      'plotly.js': 'plotly.js-basic-dist'
    }
  }
});

Addon Installation

Install the addon and webpack dependency:

npm install --save-dev ember-auto-import webpack

The addon automatically:

  • Registers with Ember CLI's addon system
  • Sets up import analysis in the build pipeline
  • Configures webpack bundling for NPM dependencies
  • Handles leader election for multiple addon instances
  • Installs babel plugin for dynamic import support

Build Pipeline Integration

The addon integrates into Ember's build process through several hooks:

/**
 * Preprocessor registry setup
 * Adds JavaScript analyzer to process imports
 */
setupPreprocessorRegistry(type: 'parent', registry: {
  add(type: 'js', processor: {
    name: 'ember-auto-import-analyzer';
    toTree: (tree: Node, inputPath: string, outputPath: string, options: any) => Node;
  }): void;
}): void;

/**
 * Tree post-processing
 * Merges webpack bundles with Ember's output
 */
postprocessTree(which: 'all', tree: Node): Node;

The build integration:

  1. Scans all JavaScript/TypeScript files for imports
  2. Identifies NPM package dependencies
  3. Creates separate webpack bundles for external dependencies
  4. Merges bundles into the final Ember application output
  5. Handles code splitting for dynamic imports

Multi-Addon Coordination

When multiple instances of ember-auto-import exist in the dependency tree, leader election ensures only one instance handles bundling:

/**
 * AutoImport shared API for cross-version compatibility
 * Ensures consistent behavior across different addon versions
 */
interface AutoImportSharedAPI {
  isPrimary(addonInstance: AddonInstance): boolean;
  analyze(tree: Node, addon: AddonInstance, treeType?: TreeType, supportsFastAnalyzer?: true): Node;
  included(addonInstance: AddonInstance): void;
  addTo(tree: Node): Node;
  registerV2Addon(packageName: string, packageRoot: string, compatOptions?: CompatOptions): void;
}

The leader election system:

  • Coordinates between multiple addon instances
  • Prevents duplicate bundling work
  • Maintains compatibility across addon versions
  • Handles complex dependency hierarchies

Types

/**
 * Broccoli tree node for build pipeline integration
 */
interface Node {
  // Broccoli tree node interface
}

/**
 * Ember addon instance interface
 */
interface AddonInstance {
  project: Project;
  app: AppInstance;
  parent: AddonInstance | AppInstance;
  // Additional Ember addon properties
}

/**
 * Tree type for different parts of Ember app
 */
type TreeType = 'app' | 'addon' | 'addon-templates' | 'addon-test-support' | 'styles' | 'templates' | 'test';

/**
 * Compatibility options for v2 addons
 */
interface CompatOptions {
  customizeMeta?: (meta: AddonMeta) => AddonMeta;
}