tessl/npm-requirejs

A command line tool for running JavaScript scripts that use the Asynchronous Module Definition API (AMD) for declaring and using JavaScript modules and regular JavaScript script files.

—

Pending

Overview

Eval results

Files

Configuration

Name: tessl/npm-requirejs
Author: tessl

RequireJS provides a comprehensive configuration system that allows you to customize module loading behavior, path resolution, dependency management, and many other aspects of the AMD loader.

Capabilities

Main Configuration Function

Configure the RequireJS loader with various options for customizing module loading behavior.

/**
 * Configure RequireJS loader settings
 * @param {Object} config - Configuration object with various options
 */
function requirejs.config(config);
function require.config(config);

Core Configuration Options

Base URL Configuration

Set the base path for module resolution.

/**
 * Base URL for loading modules
 * @type {String}
 */
config.baseUrl;

Usage:

requirejs.config({
    baseUrl: '/js/app'
});

Path Mappings

Map module names to specific file paths.

/**
 * Path mappings for module names
 * @type {Object}
 */
config.paths;

Usage:

requirejs.config({
    paths: {
        'jquery': 'vendor/jquery-3.6.0',
        'underscore': 'vendor/underscore-1.13.1',
        'backbone': 'vendor/backbone-1.4.0',
        'templates': '../templates',
        'app': 'application'
    }
});

Shim Configuration

Configure non-AMD scripts to work with RequireJS.

/**
 * Shim configuration for non-AMD scripts
 * @type {Object}
 */
config.shim;

interface ShimConfig {
    deps?: string[];           // Dependencies for the shimmed script
    exports?: string;          // Global variable name to export
    init?: Function;          // Initialization function
}

Usage:

requirejs.config({
    shim: {
        'backbone': {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
        },
        'underscore': {
            exports: '_'
        },
        'jquery.plugin': {
            deps: ['jquery'],
            init: function() {
                return jQuery.noConflict();
            }
        }
    }
});

Module ID Mapping

Map one module ID to another for versioning and legacy support.

/**
 * Module ID mappings for versioning and compatibility
 * @type {Object}
 */
config.map;

Usage:

requirejs.config({
    map: {
        '*': {
            'oldModule': 'newModule',
            'legacy': 'modern-replacement'
        },
        'some/newmodule': {
            'foo': 'foo1.2'
        }
    }
});

Package Configuration

Configure package-style modules with main files and locations.

/**
 * Package configurations for multi-file modules
 * @type {Array}
 */
config.packages;

interface PackageConfig {
    name: string;              // Package name
    location?: string;         // Package location (relative to baseUrl)
    main?: string;            // Main module file (default: 'main')
}

Usage:

requirejs.config({
    packages: [
        {
            name: 'myPackage',
            location: 'vendor/myPackage',
            main: 'index'
        },
        {
            name: 'dojo',
            location: 'vendor/dojo',
            main: 'main'
        }
    ]
});

Module-Specific Configuration

Pass configuration data to specific modules.

/**
 * Module-specific configuration data
 * @type {Object}
 */
config.config;

Usage:

requirejs.config({
    config: {
        'app/module': {
            apiKey: 'abc123',
            debug: true,
            endpoint: 'https://api.example.com'
        }
    }
});

// In app/module.js
define(['module'], function(module) {
    var config = module.config();
    console.log(config.apiKey); // 'abc123'
});

Dependency and Callback Configuration

Configure initial dependencies and startup callback.

/**
 * Dependencies to load immediately
 * @type {Array}
 */
config.deps;

/**
 * Callback function executed after deps are loaded
 * @type {Function}
 */
config.callback;

Usage:

requirejs.config({
    deps: ['app/main', 'app/init'],
    callback: function() {
        console.log('Application initialized');
    }
});

Advanced Configuration Options

Enforcement and Validation

/**
 * Enforce that all scripts call define()
 * @type {Boolean}
 */
config.enforceDefine;

/**
 * Wait for all define() calls before executing
 * @type {Boolean}
 */
config.waitSeconds;

Usage:

requirejs.config({
    enforceDefine: true,
    waitSeconds: 30  // 30 second timeout
});

URL and Script Configuration

/**
 * Query string arguments to append to URLs
 * @type {String}
 */
config.urlArgs;

/**
 * Script tag type attribute
 * @type {String}
 */
config.scriptType;

/**
 * Create script tags compatible with XHTML
 * @type {Boolean}
 */
config.xhtml;

/**
 * Skip processing data-main attribute
 * @type {Boolean}
 */
config.skipDataMain;

Usage:

requirejs.config({
    urlArgs: 'bust=' + (new Date()).getTime(),
    scriptType: 'text/javascript',
    xhtml: false,
    skipDataMain: false
});

Context Configuration

/**
 * Context name for this configuration
 * @type {String}
 */
config.context;

/**
 * Node.js specific options
 * @type {Object}
 */
config.nodeIdCompat;

Usage:

// Create isolated context
const myContext = requirejs.config({
    context: 'myApp',
    baseUrl: '/js/myapp',
    paths: {
        'lib': 'libraries'
    }
});

// Use context-specific require
myContext(['lib/helper'], function(helper) {
    helper.initialize();
});

Configuration Examples

Basic Web Application

requirejs.config({
    baseUrl: '/js',
    paths: {
        'jquery': 'vendor/jquery-3.6.0.min',
        'bootstrap': 'vendor/bootstrap.bundle.min',
        'app': 'application'
    },
    shim: {
        'bootstrap': {
            deps: ['jquery']
        }
    },
    deps: ['app/main']
});

Node.js Application

const requirejs = require('requirejs');

requirejs.config({
    nodeRequire: require,
    baseUrl: __dirname + '/lib',
    paths: {
        'lodash': '../node_modules/lodash/lodash'
    }
});

Development vs Production

// Development configuration
requirejs.config({
    baseUrl: '/js',
    urlArgs: 'bust=' + Date.now(),  // Cache busting
    paths: {
        'jquery': 'vendor/jquery-3.6.0',  // Unminified
        'app': 'src'
    }
});

// Production configuration
requirejs.config({
    baseUrl: '/js',
    paths: {
        'jquery': 'vendor/jquery-3.6.0.min',  // Minified
        'app': 'dist'
    }
});

Multi-Version Module Support

requirejs.config({
    paths: {
        'jquery': 'vendor/jquery-3.6.0',
        'jquery2': 'vendor/jquery-2.2.4'
    },
    map: {
        'legacy-module': {
            'jquery': 'jquery2'
        },
        '*': {
            'jquery': 'jquery'
        }
    }
});

Environment-Specific Configuration

Browser Detection

if (typeof window !== 'undefined') {
    // Browser environment
    requirejs.config({
        baseUrl: '/js',
        paths: {
            'dom': 'browser/dom-utils'
        }
    });
} else {
    // Node.js environment
    requirejs.config({
        nodeRequire: require,
        baseUrl: __dirname + '/lib',
        paths: {
            'fs': 'node/file-utils'
        }
    });
}

Conditional Module Loading

requirejs.config({
    map: {
        '*': {
            'http': typeof window !== 'undefined' ? 'browser/http' : 'node/http',
            'storage': typeof localStorage !== 'undefined' ? 'browser/storage' : 'node/storage'
        }
    }
});

Configuration Validation

RequireJS validates configuration options and provides helpful error messages:

// Invalid configuration will log warnings
requirejs.config({
    baseUrl: '/js',
    paths: {
        'invalid-path': function() {} // Error: paths must be strings
    }
});

Types

interface RequireConfig {
    baseUrl?: string;
    paths?: { [key: string]: string };
    shim?: { [key: string]: ShimConfig };
    map?: { [key: string]: { [key: string]: string } };
    packages?: PackageConfig[];
    config?: { [key: string]: any };
    deps?: string[];
    callback?: Function;
    enforceDefine?: boolean;
    xhtml?: boolean;
    urlArgs?: string;
    scriptType?: string;
    skipDataMain?: boolean;
    context?: string;
    waitSeconds?: number;
    nodeIdCompat?: boolean;
}

interface ShimConfig {
    deps?: string[];
    exports?: string;
    init?: Function;
}

interface PackageConfig {
    name: string;
    location?: string;
    main?: string;
}

Install with Tessl CLI