# Integrations

The following packages integrate Handlebars in different environments. These packages are not officially supported by the Handlebars team.

There are multiple webpack-plugins that allow you to use Handlebars in a Webpack environment.

# Webpack: handlebars-loader

The handlebars-loader (opens new window) allow you to import precompiled template. Just write your handlebars-template into a template.handlebars-file and import it using

const compiledTemplate = require("./template.handlebars");


import compiledTemplate from "./template.handlebars";

# Webpack: handlebars-webpack-plugin

The handlebars-webpack-plugin (opens new window) uses Handlebars to build your HTML-pages statically when compiling your application

# Webpack: html-bundler-webpack-plugin

The html-bundler-webpack-plugin (opens new window) uses various templating engines, including Handlebars (opens new window), to render templates and bundle styles and scripts into generated HTML.

# Babel: handlebars-inline-precompile

The babel-plugin-handlebars-inline-precompile (opens new window) precompiles Handlebars templates that are provided as template literals in the JavaScript source code:

import hbs from "handlebars-inline-precompile";
const compiledTemplate = hbs`{{name}}`;

Please refer to the documentation of the package for setup instructions.

# Browserify: hbsfy

The hbsfy (opens new window) package allows you to import precompiled templates in a browserify environment:

const compiledTemplate = require("./template.handlebars");

# Parcel: parcel-plugin-handlebars

There is an old plugin for parcel: https://www.npmjs.com/package/parcel-plugin-handlebars

But you should use one of the many forks of this package, which are more up-to-date: https://www.npmjs.com/search?q=parcel-plugin-handlebars

The most recent one is: https://www.npmjs.com/package/@inventory/parcel-plugin-handlebars

# Parcel: parcel-plugin-handlebars-precompile

TODO: Write text here


Last Updated: 8/5/2023, 1:00:37 PM