tessl/npm-babel--helper-module-imports

Babel helper functions for inserting module loads

Overall
score

99%

Overview

Eval results

Files

Browser-Compatible JavaScript Transformer

Name: tessl/npm-babel--helper-module-imports
Author: tessl

Create a JavaScript transformation tool that takes modern JavaScript code and transforms it to be compatible with specific browser targets.

Requirements

Your tool should:

Accept source code as a string and target environment specification
Transform the code to be compatible with the specified targets using appropriate syntax transformations
Return the transformed code with optional source maps and metadata
Support target specification formats:
- Browserslist queries (e.g., "last 2 versions", "IE 11")
- Node versions (e.g., "node 14")
Support configuration options for:
- Module format output (CommonJS, ESM, etc.)
- Debug mode to show applied transformations

Implementation

@generates

API

/**
 * Transform JavaScript code for specific target environments
 *
 * @param {string} code - The source code to transform
 * @param {object} options - Transformation options
 * @param {string|object} options.targets - Target environments (browserslist query or targets object)
 * @param {string|boolean} [options.modules] - Module format: 'commonjs', 'amd', 'umd', 'systemjs', false for ESM
 * @param {boolean} [options.debug] - Enable debug mode to see applied transformations
 * @param {boolean} [options.sourceMaps] - Generate source maps
 * @returns {object} Result object with { code, map, metadata }
 */
function transform(code, options) {
  // IMPLEMENTATION HERE
}

module.exports = { transform };

Test Cases

Basic transformation @test

const { transform } = require('./src/transformer');

// Modern JavaScript with arrow functions, const/let, template literals
const modernCode = `
const greet = (name) => {
  const message = \`Hello, \${name}!\`;
  return message;
};
`;

const result = transform(modernCode, {
  targets: 'IE 11'
});

// Should transform to ES5 compatible code
// - Arrow functions become regular functions
// - const/let become var
// - Template literals become concatenation
console.assert(result.code.includes('function'));
console.assert(!result.code.includes('=>'));
console.assert(!result.code.includes('const'));

Target-based transformation @test

const { transform } = require('./src/transformer');

const code = 'const x = y ?? "default";'; // Nullish coalescing

// Modern browsers - should keep nullish coalescing
const modernResult = transform(code, {
  targets: 'last 1 chrome version'
});
console.assert(modernResult.code.includes('??'));

// Older browsers - should transform nullish coalescing
const legacyResult = transform(code, {
  targets: 'IE 11'
});
console.assert(!legacyResult.code.includes('??'));

Module transformation @test

const { transform } = require('./src/transformer');

const esmCode = `
import { add } from './math';
export const result = add(1, 2);
`;

// Transform to CommonJS
const cjsResult = transform(esmCode, {
  targets: 'node 10',
  modules: 'commonjs'
});

console.assert(cjsResult.code.includes('require'));
console.assert(cjsResult.code.includes('exports'));

// Keep as ESM
const esmResult = transform(esmCode, {
  targets: 'node 14',
  modules: false
});

console.assert(esmResult.code.includes('import'));
console.assert(esmResult.code.includes('export'));

Debug mode @test

const { transform } = require('./src/transformer');

const code = 'const x = [1, 2, ...arr];';

const result = transform(code, {
  targets: 'IE 11',
  debug: true
});

// Debug mode should provide metadata about transformations
console.assert(result.metadata);
console.assert(Array.isArray(result.metadata.plugins) || Array.isArray(result.metadata.transformations));
console.assert(result.metadata.plugins.length > 0 || result.metadata.transformations.length > 0);

Dependencies { .dependencies }

@babel/core { .dependency }

Provides the core Babel transformation engine.

@babel/preset-env { .dependency }

Provides automatic target-based transformation capabilities.

Install with Tessl CLI

npx tessl i tessl/npm-babel--helper-module-imports