Registry / devops / base64-inline-loader

base64-inline-loader

library2.0.1jsnpmunverified

Webpack loader that encodes binary files (images, fonts) into Base64 data URIs inline. v2.0.1, stable with occasional updates. Differentiates from url-loader / file-loader by enforcing base64 encoding for all matched assets without file-size fallback. Supports configurable file size limit and custom MIME-type mapping. Requires webpack 4+ and Node >=6.2.

devops

npm install base64-inline-loader

github ↗package ↗

INSTALL

IMPORT

SIG · BASE64-INLINE-LOAD

base64-inline-loader

devopsjavascriptv2.0.1

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–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

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

base64-inline-loader

✓ module: { rules: [{ test: /\.(png|jpg)$/, use: ['base64-inline-loader'] }] }

Not a JavaScript import; configure in webpack config as a loader.

Webpack configuration using base64-inline-loader with limit and typeMapper options.

// webpack.config.js const path = require('path'); module.exports = { entry: './src/index.js', output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js', }, module: { rules: [ { test: /\.(jpe?g|png|ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/, use: [ { loader: 'base64-inline-loader', options: { limit: 1000, // files <= 1KB are inlined typeMapper: { 'image/x-icon': 'image/vnd.microsoft.icon' }, }, }, ], }, ], }, };

Debug

Known issues

deprecatedPackage uses deprecated query parameter syntax for loader options

fix

Use object syntax: { loader: 'base64-inline-loader', options: { limit: 1000 } }

affects: >=1.0.0 <2.0.0

gotchaLoader encodes all files regardless of size; no 'fallback' to file-loader as in url-loader

fix

Wanted: set a limit to skip encoding. To exclude: add negative lookahead or use multiple rules.

affects: >=1.0.0

gotchaUsing absolute paths in test regex may cause unexpected behavior

fix

Always use relative patterns like /\.(png|jpg)$/ instead of /images/

affects: >=1.0.0

Errors

Common errors & fixes

Module parse failed: Unexpected token (1:0)

Webpack cannot parse binary files without a loader matching the rule.

fix

Add base64-inline-loader rule for binary file types or use file-loader/url-loader.

Error: 'base64-inline-loader' is not a valid loader.

Loader not installed or webpack config not written in proper JSON.

fix

Run 'npm install base64-inline-loader --save-dev' and ensure config uses object syntax for options.

WARNING in Circular dependency detected: ...

Using loader on files imported by itself (e.g., .css importing .png, and .png loaded via base64-inline-loader).

fix

Ensure loader rules are scoped to binary files only, not shared with non-binary rules.

Upgrade

Version history

2.0.1latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

10 hits · last 30 days

node

Resources

githubhttps://github.com/monolithed/base64-inline-loader ↗

packagehttps://www.npmjs.com/package/base64-inline-loader ↗