Registry / devops / webpack-webmanifest-loader

webpack-webmanifest-loader

library2.0.2jsnpmunverified

A minimalistic webpack loader that generates Web App Manifest files (webmanifest) and processes icon URLs with cache busting. It requires webpack 5.1+ and has zero runtime dependencies. Unlike plugins that generate manifests separately, this loader integrates into webpack's module graph, allowing icons to be processed through the asset module pipeline. Version 2.0.2 is the latest stable release, with the package renamed from webpack-webmanifest-plugin in v2.0.1. Release cadence is sporadic, with no updates since late 2021. Key differentiators: zero dependencies, content hash support for icons, and simple configuration.

devops

npm install webpack-webmanifest-loader

github ↗package ↗

INSTALL

IMPORT

SIG · WEBPACK-WEBMANIFES

webpack-webmanifest-loader

devopsjavascriptv2.0.2

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

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 18–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

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

default

✓ module.exports = { module: { rules: [ { test: /\.webmanifest$/i, use: 'webpack-webmanifest-loader', type: 'asset/resource' } ] } }

✗ const webpackWebmanifestLoader = require('webpack-webmanifest-loader');

This is a webpack loader, not a standalone module. It is used via webpack config rules, not imported directly.

Webpack configuration using the loader to process .webmanifest files and icon assets.

// webpack.config.js const path = require('path'); module.exports = { mode: 'development', entry: './src/index.js', output: { filename: 'bundle.js', path: path.resolve(__dirname, 'dist'), }, module: { rules: [ { test: /\.(png|svg|webp|jpg|jpeg)$/i, type: 'asset/resource', }, { test: /\.webmanifest$/i, use: 'webpack-webmanifest-loader', type: 'asset/resource', }, ], }, };

Debug

Known issues

breakingPackage renamed from webpack-webmanifest-plugin to webpack-webmanifest-loader. Previous installs may have old package.

fix

Uninstall old package (npm uninstall webpack-webmanifest-plugin) and install new package (npm install -D webpack-webmanifest-loader). Update webpack config to use loader name.

affects: >=1.0.0 <2.0.0

breakingRequires webpack 5.1+. Will not work with webpack 4.

fix

Ensure webpack version is 5.1 or higher. Upgrade if necessary.

affects: >=0.0.0

gotchaThe loader expects 'type: 'asset/resource'' in the rule; otherwise, the manifest output may not be emitted correctly.

fix

Add type: 'asset/resource' to the .webmanifest rule in webpack config.

affects: >=0.0.0

gotchaIcon paths in the manifest must be resolvable by webpack (e.g., relative paths or module aliases). Absolute paths may not be processed.

fix

Use relative paths from the manifest file to the icon assets, and ensure those assets are handled by a loader (e.g., asset/resource).

affects: >=0.0.0

deprecatedNo updates since v2.0.2 (late 2021). May not be actively maintained. Consider using alternative solutions.

fix

Evaluate if the still works for your webpack version. For critical projects, consider alternatives like favicons-webpack-plugin or manual manifest generation.

affects: >=2.0.2

Errors

Common errors & fixes

Error: Module parse failed: Unexpected token (1:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.

Webpack does not have a rule to handle .webmanifest files.

fix

Add the loader rule as shown in the quickstart: { test: /\.webmanifest$/i, use: 'webpack-webmanifest-loader', type: 'asset/resource' }.

Error: Cannot find module 'webpack-webmanifest-loader'

Package not installed or incorrectly referenced.

fix

Run 'npm install -D webpack-webmanifest-loader' and ensure the loader name is correct in webpack config.

Module not found: Error: Can't resolve '../images/touch/homescreen48.png'

Icon path in manifest is not resolvable by webpack.

fix

Ensure the icon path is correct relative to the manifest file, and that the image file exists. Also ensure the image rule is configured to handle png files.

Upgrade

Version history

2.0.2latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

9 hits · last 30 days

node

Amazon

Resources

githubhttps://github.com/usmanyunusov/webpack-webmanifest-loader ↗

packagehttps://www.npmjs.com/package/webpack-webmanifest-loader ↗