Registry / web-framework / handlebars-loader

handlebars-loader

JSON →
library1.7.3jsnpmunverified

A webpack loader for Handlebars templates that automatically resolves partials and helpers relative to the current file or via module prefixes. Version 1.7.3 is stable with infrequent releases; supports Handlebars 3.x and 4.x. Differentiators include automatic resolution, inline require support, and configurable directories for helpers/partials. Notable: v1.7.3 updates loader-utils dependency to address security vulnerabilities.

npm install handlebars-loader
INSTALL
IMPORT
SIG · HANDLEBARS-LOADER
H
handlebars-loader
web-frameworkjavascriptv1.7.3
Install
Import
Disk
Pass rate
0/ 6
Env Coverage0 / 6
glibc
1822
musl
1822
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18226 runs
build_error
glibc
node 18226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

default
import template from './file.handlebars';
const template = require('./file.handlebars');
Use ESM import syntax with webpack 2+.
default (for webpack config)
module.exports = { module: { rules: [ { test: /\.handlebars$/, loader: 'handlebars-loader' } ] } };
module.exports = { module: { loaders: [ { test: /\.handlebars$/, loader: 'handlebars-loader' } ] } };
Webpack 2+ uses 'rules' instead of 'loaders'.
no direct import
This loader is not imported directly by user code; it is referenced in webpack config.
import handlebarsLoader from 'handlebars-loader';
Do not import the loader in your entry files; it's used internally by webpack.

Shows installation, webpack configuration with common options, and usage of a Handlebars template in a JavaScript entry file.

npm install handlebars-loader handlebars --save-dev // webpack.config.js module.exports = { module: { rules: [ { test: /\.handlebars$/, loader: 'handlebars-loader', options: { knownHelpers: ['if', 'unless', 'each', 'with', 'lookup'], helperDirs: ['/path/to/helpers'], partialDirs: ['/path/to/partials'], debug: true } } ] } }; // entry.js const template = require('./template.handlebars'); document.body.innerHTML = template({ name: 'World' });
Debug
Known issues
breakingWebpack 4+ removed the deprecated `loader` property in favor of `use` in module rules.
fix
Use `use: 'handlebars-loader'` or `loader: 'handlebars-loader'` inside a `use` array.
affects: >=1.7.0
deprecatedThe `inlineRequires` option requires disabling `esModule` in file-loader/webpack5 asset modules.
fix
Set `esModule: false` in your file-loader config or use `type: 'javascript/auto'` for asset modules.
affects: >=1.5.0
gotchaPartials and helpers are resolved relative to the current template unless prefixed with `$` to denote a module.
fix
Use `{{> $module/partial}}` for node_modules partials, or set `rootRelative` option.
affects: all
breakingUpgrading from webpack 1 to 2+ requires changing `loaders` key to `rules` and `loader` to `use`.
fix
Update webpack config to use `module.rules` array.
affects: >=1.4.0
Errors
Common errors & fixes
Module not found: Error: Can't resolve 'handlebars'
Handlebars is a peer dependency and must be installed separately.
fix
Run `npm install handlebars --save-dev`.
ERROR in ./template.handlebars 1:0 Module parse failed: Unexpected token (1:0)
The loader is not correctly configured in webpack, or the test regex does not match the file extension.
fix
Ensure your webpack config has a rule with `test: /\.handlebars$/` and `loader: 'handlebars-loader'`.
Cannot find module 'handlebars/runtime'
The runtime path is not resolved correctly when using `runtime` option or default resolution fails.
fix
Set the `runtime` option explicitly: `options: { runtime: 'handlebars/dist/cjs/handlebars.runtime.js' }`.
Upgrade
Version history
1.7.3latest on npm
Audit
Dependencies
handlebarsrequiredPeer dependency; runtime used by generated templates.
loader-utilsrequiredRequired by webpack loaders for utility functions.
Agent activity
12 hits · last 30 days
node
12
Resources
handlebars-loader — npm install handlebars-loader · libregistry