Lodash _.templateSettings.imports

What You’ll Learn

By the end of this tutorial, you’ll know how to inject Lodash and custom helpers into _.template() scope using the imports object.

What Is _.templateSettings.imports?

_.templateSettings.imports is an object whose properties become local variables inside compiled template functions. The most common entry is _, which exposes the Lodash library so you can write <%= _.max(obj.scores) %> or <% _.forEach(obj.users, function (u) { %> directly in template source.

Beyond Lodash, teams add formatters, i18n helpers, or URL builders to imports so templates stay declarative without duplicating utility logic in every tag expression.

📝 Syntax

Assign properties on the global settings object or pass them per compile:

_.templateSettings.imports._ = _;

// Add a custom helper:
_.templateSettings.imports.formatPrice = function (n) {
  return "$" + n.toFixed(2);
};

Syntax Rules

• Type — plain object mapping string keys to functions, values, or libraries.
• Default — Lodash often pre-populates _ in browser builds; set it explicitly in Node.
• Template usage — reference imported names directly in tag expressions: _.join(...), formatPrice(...).
• Data vs imports — render data uses obj (or your variable name); helpers live on imports.
• Compile time — Lodash merges imports when building the render function.

import template from "lodash/template";

_.templateSettings.imports._ = _;

const tpl = template("The square root of 25 is <%= _.sqrt(25) %>.");
console.log(tpl());
// -> "The square root of 25 is 5"

Examples Gallery

Practical imports patterns with copy-ready code, sample output, and interactive Try It Yourself labs.

_.templateSettings.imports._ = _;

const tpl = _.template("The square root of 25 is <%= _.sqrt(25) %>.");
console.log(tpl());
// -> "The square root of 25 is 5"

The square root of 25 is 5

_.templateSettings.imports._ = _;

const tpl = _.template("Hello, <%= _.upperCase(obj.name) %>!");
console.log(tpl({ name: "john" }));
// -> "Hello, JOHN!"

Hello, JOHN!

_.templateSettings.imports.formatPrice = function (amount) {
  return "$" + amount.toFixed(2);
};

const invoiceTpl = _.template(
  "Total due: <%= formatPrice(obj.total) %>"
);

console.log(invoiceTpl({ total: 49.5 }));
// -> "Total due: $49.50"

Total due: $49.50

_.templateSettings.imports._ = _;

const listTpl = _.template(
  "<ul>" +
  "<% _.forEach(obj.users, function (user) { %>" +
  "<li><%= user.name %></li>" +
  "<% }); %>" +
  "</ul>"
);

console.log(listTpl({
  users: [{ name: "Ada" }, { name: "Grace" }]
}));

<ul><li>Ada</li><li>Grace</li></ul>

const badgeTpl = _.template(
  "Status: <%= badge(obj.level) %>",
  {
    imports: {
      badge: function (level) {
        return level === "pro" ? "PRO" : "FREE";
      }
    }
  }
);

console.log(badgeTpl({ level: "pro" }));
// -> "Status: PRO"

Status: PRO

_.templateSettings.imports._ = _;

const summaryTpl = _.template(
  "Items: <%= obj.items.length %> | Total: <%= _.sum(obj.items) %>"
);

console.log(summaryTpl({ items: [10, 20, 5] }));
// -> "Items: 3 | Total: 35"

Items: 3 | Total: 35

📝 Notes

• imports is an object, not a single function or RegExp.
• imports._ is the conventional key for Lodash—set it explicitly in Node.js builds.
• Custom helpers should be trusted code you control, never user callbacks.
• Imports are fixed at compile time; changing global imports does not update old render functions.
• Data fields live on obj (or your variable name)—do not confuse with import keys.
• Keep helpers small; heavy logic belongs in JavaScript before calling the template.

💡 Best Practices