Registry / devops / node-sass-glob-importer

node-sass-glob-importer

library5.3.3jsnpmunverified

node-sass-glob-importer is a custom importer for node-sass (currently at v5.3.3) that enables the use of glob syntax within Sass `@import` statements. This allows developers to import multiple Sass files using pattern matching, such as `@import 'scss/**/*.scss';`, significantly streamlining stylesheet management in projects with numerous partials. The package is maintained as part of the `node-sass-magic-importer` monorepo, where all included packages, including this one, maintain synchronized versioning (starting from 5.0.0 after integrating into the monorepo). It receives regular maintenance updates, primarily for dependency bumps, bug fixes, and minor feature enhancements. Its key differentiator is simplifying the import process for large Sass projects by aggregating many partials without listing each one individually, leveraging the existing `node-sass` ecosystem for compilation. Users should be aware that `node-sass` itself is a wrapper around the now-deprecated LibSass, and modern Sass development has largely shifted to Dart Sass.

devops

npm install node-sass-glob-importer

github ↗package ↗

INSTALL

IMPORT

SIG · NODE-SASS-GLOB-IMP

node-sass-glob-importer

devopsjavascriptv5.3.3

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.

globImporter

✓ import { globImporter } from 'node-sass-glob-importer';

✗ import globImporter from 'node-sass-glob-importer';

Since version 5.x.x, `globImporter` is a named export for ESM modules. Default imports are incorrect.

globImporter

✓ const { globImporter } = require('node-sass-glob-importer');

✗ const globImporter = require('node-sass-glob-importer');

When using CommonJS, `globImporter` must be destructured as it is a named export.

GlobImporterOptions

✓ import type { GlobImporterOptions } from 'node-sass-glob-importer';

TypeScript type definition for configuring the glob importer, useful for type-safe configuration.

This Webpack configuration demonstrates how to integrate `node-sass-glob-importer` with `sass-loader` and `MiniCssExtractPlugin` to enable glob imports in your Sass files within a Webpack build pipeline.

/* webpack.config.js */ const { globImporter } = require('node-sass-glob-importer'); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); // Ensure you have `node-sass`, `sass-loader`, `mini-css-extract-plugin`, and `webpack` installed. // npm install --save-dev node-sass sass-loader mini-css-extract-plugin webpack webpack-cli module.exports = { entry: './src/index.scss', output: { filename: 'bundle.js', path: require('path').resolve(__dirname, 'dist'), }, module: { rules: [ { test: /\.scss$/, use: [ MiniCssExtractPlugin.loader, 'css-loader', { loader: 'sass-loader', options: { sassOptions: { importer: globImporter() // Use the glob importer here } } } ] } ] }, plugins: [ new MiniCssExtractPlugin({ filename: 'style.css' }) ] }; /* src/index.scss */ @import 'styles/**/*.scss'; /* Example glob import */ /* src/styles/_base.scss */ body { font-family: sans-serif; } /* src/styles/_vars.scss */ $primary-color: blue;

Debug

Known issues

breakingWhen upgrading from versions 3.x.x to 5.x.x, the `includePaths` option can no longer be set directly when initializing the importer. This option must now be configured through `node-sass`'s `sassOptions`.

fix

Migrate `includePaths` configuration from `importer: globImporter({ includePaths: [...] })` to `sassOptions: { includePaths: [...] }` within your `node-sass` or `sass-loader` setup.

affects: >=5.0.0

gotcha`node-sass-glob-importer` relies on `node-sass`, which is a wrapper around the deprecated LibSass. Modern Sass development has largely transitioned to Dart Sass (`sass` package). While functional, new projects should carefully consider using `node-sass` and its ecosystem due to its maintenance status.

fix

For new projects, consider using Dart Sass (`sass` package) with its own globbing solutions if available, or evaluate the long-term implications of relying on the `node-sass` ecosystem.

affects: >=3.0.0

gotchaDue to `node-sass-glob-importer` being part of a monorepo, version 4.x.x was intentionally skipped to synchronize versions across all packages within the `node-sass-magic-importer` project. Direct upgrades from 3.x.x will jump straight to 5.x.x.

fix

Be aware that version 4.x.x does not exist for this package. Consult the release notes for version 5.0.0 and subsequent releases for all breaking changes and new features when upgrading from 3.x.x.

affects: >=5.0.0

Errors

Common errors & fixes

Error: `includePaths` is not a valid option for `node-sass-glob-importer`

Attempting to configure `includePaths` directly within the `globImporter()` function after upgrading to v5.x.x.

fix

Move the `includePaths` option to the `sassOptions` object provided to `node-sass` or `sass-loader`.

SassError: Can't find stylesheet to import.

Incorrect glob pattern, path issues, or missing files that match the pattern. This error is generic for Sass import failures.

fix

Double-check your glob patterns, ensure the paths are correct relative to the importing file, and verify that files matching the pattern actually exist. Ensure `node-sass-glob-importer` is correctly configured in your build process.

TypeError: globImporter is not a function

Incorrect import statement; attempting to use a default import or a non-destructured CommonJS `require` when `globImporter` is a named export.

fix

For ESM, use `import { globImporter } from 'node-sass-glob-importer';`. For CommonJS, use `const { globImporter } = require('node-sass-glob-importer');`.

Upgrade

Version history

5.3.3latest on npm

Audit

Dependencies

node-sassrequiredCore dependency for integrating the custom importer with the Sass compiler.

webpackoptionalCommonly used build tool for bundling assets where Sass compilation often occurs.

sass-loaderoptionalWebpack loader required to process Sass files within a Webpack build.

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/maoberlehner/node-sass-magic-importer ↗

packagehttps://www.npmjs.com/package/node-sass-glob-importer ↗