Registry / devops / webpack-import-glob

webpack-import-glob

library2.0.0jsnpmunverified

Webpack preloader that expands glob patterns in ES6 import statements (and SCSS @import) into multiple explicit imports. Version 2.0.0 is stable, last updated 2018. Replaces the unmaintained import-glob package. Supports JS and SCSS files. Works as a preloader or chained loader. Differentiators: simple glob expansion, no code splitting. Alternatives like webpack-import-glob-loader are more modern but this remains functional for legacy webpack 2-3 projects.

devops

npm install webpack-import-glob

github ↗package ↗

INSTALL

IMPORT

SIG · WEBPACK-IMPORT-GLO

webpack-import-glob

devopsjavascriptv2.0.0

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.

default

✓ import modules from './foo/**/*.js'

✗ import { modules } from './foo/**/*.js' (named import for glob results is not supported)

Glob import returns an array of modules as default export. Named imports won't work.

side-effect import

✓ import './foo/**/*.scss'

✗ import * from './foo/**/*.scss' (no need for namespace import for side-effects)

For side-effect imports, just the path without default or named import.

webpack loader configuration

✓ { test: /\.js$/, enforce: 'pre', loader: 'import-glob' }

✗ { test: /\.js$/, use: 'import-glob' } (must be preloader/enforce:pre, not ordinary loader)

Loader must run before other loaders to expand globs. Use enforce: 'pre' or preloaders in webpack 2/3.

Shows installation and webpack configuration to enable glob imports in JS files, with example usage.

// Install: npm install --save-dev import-glob webpack-import-glob // webpack.config.js module.exports = { module: { rules: [ { test: /\.js$/, enforce: 'pre', loader: 'import-glob' } ] } }; // Then in any JS file: import modules from './components/**/*.js'; // expands to multiple imports console.log(modules); // array of module exports

Debug

Known issues

deprecatedPackage is no longer maintained; last update 2018. May not work with webpack 4+.

fix

Consider alternatives like webpack-import-glob-loader or use webpack's built-in resolve.alias with manual imports.

affects: >=2.0.0

gotchaLoader must be applied as a preloader (enforce: 'pre') otherwise it will break other loaders like babel.

fix

Use enforce: 'pre' or preloaders (deprecated) in webpack config.

affects: >=1.0.0

gotchaGlob patterns only work for default imports or side-effect imports; named imports like import { foo } from './**/*.js' are not expanded.

fix

Use default import for aggregation, or side-effect imports for styles.

affects: >=1.0.0

gotchaThe package is named webpack-import-glob but the actual loader name is import-glob. Installing import-glob as a dependency is mandatory.

fix

Run: npm install import-glob --save-dev, not webpack-import-glob.

affects: >=1.0.0

Errors

Common errors & fixes

Module parse failed: Unexpected token (1:0)

Loader not configured as preloader; other loaders (e.g., babel) encounter glob syntax before expansion.

fix

Add enforce: 'pre' to the rule: { enforce: 'pre', test: /\.js$/, loader: 'import-glob' }

Cannot find module 'import-glob'

Did not install the underlying import-glob package.

fix

npm install import-glob --save-dev

Error: The type 'pre' in the array must be a string...

Webpack 1/2 deprecated preloaders; need to use enforce: 'pre' instead of preloaders array.

fix

Remove 'preloaders' and use 'rules' with enforce: 'pre'.

Upgrade

Version history

2.0.0latest on npm

Audit

Dependencies

import-globrequiredCore library for glob expansion; webpack-import-glob is a thin webpack wrapper

Agent activity

12 hits · last 30 days

node

Resources

githubhttps://github.com/brunoosilva/webpack-import-glob ↗

packagehttps://www.npmjs.com/package/webpack-import-glob ↗