Module Lookup

Salesforce B2C Commerce supports the Modules 1.1.1 CommonJS specification so that you can access JavaScript or B2C Commerce script modules as storefront script code. Unlike traditional B2C Commerce script files, these modules don't have to be located in cartridges. For more information, see Path Lookup Behavior of the Require Method.

Note:

This topic assumes that you are familiar with the Modules 1.1.1 CommonJS specification.

What Is a B2C Commerce Script Module?

A CommonJS-compliant B2C Commerce script module is either a script file (with a .js, .json, or .ds extension) or a directory containing script files. A module can hide private data while exposing public objects and methods via a free variable named exports. A free variable is accessible within a function, but it's not a local variable defined within the function or a parameter of the function. A free variable can be (but doesn't have to be) a global variable.

Note: Storefront Reference Architecture (SFRA) uses module.exports, instead of simply exports, because it accepts objects.

Before Release 13.6, you had to use the importScript and importPackage methods to access other scripts. These methods automatically export everything into the global context. You can now access CommonJS-compliant modules using the require method and these modules don't automatically export everything into the global context.

Within a script file, you load a CommonJS-compliant B2C Commerce script module using the TopLevel.global.require(path:String) method. After the module is loaded, you can use any of its exported variables or methods.

Example 1: Creating the Mod1.Js Module

In this example, the mod1 module exports the doit() method and the aaa variable, but hides the localMethod().
exports.aaa = "bbb";
exports.doit = function() {
	return "done.";
}
var localVariable = 1;

/**
* @param {String} Error message.
* @returns {Error} New object.
*/
function localMethod(message, localVariable) {
	return new Error({message: localVariable});
}

Example 2: Loading the Mod1 Module

In this example, the script loads the mod1 module, retrieves the aaa variable from the module, and runs the doit() method.

/*
 * @output ModuleId : String
 * @output Mod1_1 : String
 * @output Mod1_2 : String
 */
var m1 = require( './mod1.js' ); 

function execute( pdict )
{
	pdict.ModuleId = module.id;
	pdict.Mod1_1 = m1.aaa;
	pdict.Mod1_2 = m1.doit();
	
	return PIPELET_NEXT;
}

Path Lookup Behavior of the Require Method

B2C Commerce's TopLevel.global.require(path:String) method has different lookup behavior than the require() function, as specified in the Modules 1.1.1 CommonJS specification.

Path Lookup Relative to the Current Module

If the path argument starts with "./" or "../", then it loads relative to the current module. The module can be a file or a directory. A file extension is acknowledged, but not required. If it's a directory, a package.json or a main file is expected in the directory.

Note:

A main file is a file named main, with either a .js, .ds, or .json extension.

If the package.json file does not contain a main property, the script defaults to the main file in the directory, if one exists. Access to parent files can't go beyond the top-level version directory. Access to other cartridges is allowed.

Path Lookup Relative to the Current Cartridge

If the path argument starts with "~/", then it's a path relative to the current cartridge. This path is relative to the top level of the current cartridge.

You can use this pattern to reference a script in the current cartridge. In SFRA, this pattern is only used for scripts that you don't want others to extend or override.

var myscript = require('~/cartridge/scripts/myscript');

Path Lookup Relative to The Start of the Cartridge Path

If the path argument starts with "*/", then it's a path relative to the start of the cartridge path. This pattern is used in all require statements in the app_storefront_base cartridge.

For example, assume the following cartridge path:

app_storefront_custom:plugin_stores:app_storefront_base

Assume that you want to extend the Stores.js controller in the base cartridge, which requires the storeHelpers.js script.

var StoreHelpers = require('*/cartridge/scripts/helpers/storeHelpers');
var server = require('server');
var cache = require('*/cartridge/scripts/middleware/cache');

Assume also that the plugin_stores cartridge extends the storeHelpers.js script.

If you create a custom Stores.js controller, and you require or extend the Stores.js controller, the asterisks are in the base controller are important. They indicate that the storeHelpers.js script from the plug-in cartridge is used, if available, instead of the version in the base cartridge. Whichever version is the first one found on the cartridge path is used. In other words, whichever version is furthest to the left of the cartridge path is used.

Path Lookup of a B2C Commerce Script Package

A path argument that prepends "dw", or that starts with "dw/", references B2C Commerce built-in functions and classes, for example:
 var u = require( 'dw/util' );
This statement loads the classes in the util package, which can be then used as follows:
var h = new u.HashMap();

Path Lookup of a Top-Level Module

A path argument that doesn't start with "./" or "../" is resolved as top-level module.
  • The path argument is used to find a folder in the top-level version directory, typically a cartridge itself, but it can also be a simple folder.
  • If nothing is found, the path argument is used to look into a special folder (named modules) in the top version directory. You can use this folder to manage different modules. For example, you can drop a module like express.js into that folder.
If the TopLevel.global.require(path:String) method is used to reference a file, an optional file extension is used to determine the content of the file. Currently, B2C Commerce supports these extensions, listed in priority order:
  • .js - JavaScript file
  • .ds - B2C Commerce script file
  • .json - JSON file
Note: If you use JSON to define a module, the entire JSON object is implicitly exported via the exports variable.
Note: You can still use the importScript and importPackage methods. However, we recommend that you replace them with the TopLevel.global.require(path:String) method.

Example: Path Lookup for Global Mymodule.Js

Assume you have a script (used in SFRA) with the following call to the require() method:
var u = require( 'mymodule');

Because there's no path syntax, this statement is requiring a global module. In this case, it's requiring the mymodule module.

Assume the following project structure on your developer machine:
storefront-reference-architecture
  ├── bin
  ├── cartridges
      ├── app_storefront_base
      │   └── cartridge
      │       ├── client
      │       ├── controllers
      │           └── mymodule.js
      │       ├── forms
      │       ├── models
      │           └── mymodule.js
      │       ├── scripts
      │       ├── static
      │       └── templates
      └── modules
          └── server
      └── mymodule
          ├── myScript.ds 
          ├── package.json              
          └── main.js   
      └── mymodule.js
After upload, these files have the following structure on the server:
SITE TOP-LEVEL VERSION DIRECTORY 
    └──mymodule.js        (2)
    │
    ├───modules                         // Global modules directory
    │     └── mymodule.js  (3)
    │
    ├───mymodule                        // Module Library directory
    │     ├── myScript.ds  (1b)
    │     ├── package.json (1a)         // References myScript.ds
    │     └── main.js                   
    │
    ├───app_storefront-base             // Cartridge directory
          └── controllers 
          │  └── mymodule.js  
          └── models 
              └── mymodule.js  
Note:

This structure includes directories and files that are outside of cartridges. These files and directories don't have to be on the cartridge path to be accessible.

Regardless of where the script that requires a module is located, B2C Commerce finds the module as follows:
  1. B2C Commerce searches the mymodule directory for a package.json file.
    1. In this example, the package.json is present, so B2C Commerce checks the value of the main property in the file.
    2. This property references the myScript.ds file, so B2C Commerce loads myScript.ds as a module.
    3. If there is no package.json or if the main property is missing, B2C Commerce searches the directory for a main file to load.
    4. If B2C Commerce finds a main file, the file is loaded; otherwise, B2C Commerce continues to search.
  2. B2C Commerce finds the mymodule.js file because it's in the top-level version directory. If there is no file at this level, B2C Commerce continues to search.
  3. B2C Commerce searches the modules directory in the top level for a mymodule script file.
Note: The mymodule.js files inside the cartridge are not searched at all, because they are not global modules.
Important:

While B2C Commerce provides a sophisticated fallback mechanism for scripts in the globally available modules folder, we generally discourage polluting the global namespace with utility scripts. Instead, we recommend that you add scripts to specific project cartridges.

See also Modules.