# node-sass-importer-builder

> Utility to simplify creating importers for node-sass

Latest version **0.0.2** (published 2016-02-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install node-sass-importer-builder
pnpm add node-sass-importer-builder
yarn add node-sass-importer-builder
bun add node-sass-importer-builder
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2016-02-07 |
| First published | 2016-02-07 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | kisenka |
| Maintainers | kisenka |
| Keywords | node-sass, importer |

## Links

- npm: https://www.npmjs.com/package/node-sass-importer-builder
- Repository: https://github.com/kisenka/node-sass-importer-builder
- Homepage: https://github.com/kisenka/node-sass-importer-builder#readme
- Issues: https://github.com/kisenka/node-sass-importer-builder/issues
- npm.io page: https://npm.io/package/node-sass-importer-builder

## Dependencies (3)

- [rootbeer](https://npm.io/package/rootbeer.md) 1.0.5
- [file-exists](https://npm.io/package/file-exists.md) 1.0.0
- [is-plain-object](https://npm.io/package/is-plain-object.md) 2.0.1

## Recent versions

- 0.0.2 (latest) — 2016-02-07
- 0.0.1 — 2016-02-07

## README

# node-sass-importer-builder

Utility to simplify creating importers for node-sass.
Allows to define how node-sass should process `@import` directives with custom resources (e.g. json or js files).

## Usage

```js
var sass = require('node-sass');
var builder = require('node-sass-importer-builder');
var importer = builder(/REGEXP/, function(filepath) {
  return someTransformOperation(filepath);
});

var result = sass.renderSync({
  file: 'example.scss',
  importer: importer
});
```

via Webpack:

```js
var builder = require('node-sass-importer-builder');
var importer = builder(/REGEXP/, function(filepath) {
  return someTransformOperation(filepath);
});

module.exports = {
  module: {
    loaders: [{
      test: /\.scss$/,
      loaders: ["style", "css", "sass"]
    }]
  },

  sassLoader: {
    importer: importer
  }
}
```

## API

### `builder(pattern:RegExp, handler:Function)`

- `pattern` - regular expression pattern to match importing file.
- `handler(filepath)` - function which somehow handles importing file in SASS-compatible data type.
  Invokes with absolute file path as first argument. Function must return string, number, boolean, array, object or null.
  Strings treated as is and becomes a part of final SASS file, so you can include whole files; generate rules, variables,
  mixins and functions here. Other type will be converted in SASS data type and assigned to SASS variable (filename is used as variable name).

### `builder.toSassString(value)`

Helper to convert javascript value to SASS data type. Taken from [rootbeer](https://github.com/gkatsev/rootbeer/blob/master/src/jsToSassString.js) package.

## Examples

### Javascript importer

For example you need to share screen breakpoints config between javascript components and SCSS stylesheets:

```js
// breakpoints.js
module.exports = {
  xsmall: 0, small: 640,
  medium: 960, large: 1200,
  xlarge: 1440
}
```

Here we just calls nodejs `require` to get configuration object and return it:

```js
var importer = builder(/\.js$/, function(filepath) {
  return require(filepath);
});
```

Using this example.scss:
```scss
@import "breakpoints.js";
```

You will get:
```scss
$breakpoints: (
  "xsmall": 0,
  "small": 640,
  "medium": 960,
  "large": 1200,
  "xlarge": 1440
);
```

### YAML importer

```js
var fs   = require('fs');
var yaml = require('js-yaml');
var builder = require('node-sass-importer-builder');
var yamlImporter = builder(/\.yml$/, function(filepath) {
  return yaml.safeLoad(fs.readFileSync(filepath, 'utf8'));
});

```

---
_Source: https://npm.io/package/node-sass-importer-builder · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._