https://github.com/shinnn/sass-package-importer

A node-sass importer to resolve files from either npm packages or relative paths
https://github.com/shinnn/sass-package-importer

helper import javascript node-sass nodejs package plugin sass stylesheet

Last synced: 14 days ago
JSON representation

A node-sass importer to resolve files from either npm packages or relative paths

• Host: GitHub
• URL: https://github.com/shinnn/sass-package-importer
• Owner: shinnn
• License: isc
• Created: 2018-07-26T03:17:05.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2018-11-07T03:49:08.000Z (about 6 years ago)
• Last Synced: 2024-10-24T08:40:11.653Z (21 days ago)
• Topics: helper, import, javascript, node-sass, nodejs, package, plugin, sass, stylesheet
• Language: JavaScript
• Size: 78.1 KB
• Stars: 1
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# sass-package-importer

[![npm version](https://img.shields.io/npm/v/sass-package-importer.svg)](https://www.npmjs.com/package/sass-package-importer)

[![Build Status](https://travis-ci.com/shinnn/sass-package-importer.svg?branch=master)](https://travis-ci.com/shinnn/sass-package-importer)

[![Coverage Status](https://img.shields.io/coveralls/shinnn/sass-package-importer.svg)](https://coveralls.io/github/shinnn/sass-package-importer?branch=master)

A [node-sass](https://www.npmjs.com/package/node-sass) [importer](https://www.npmjs.com/package/node-sass#importer--v200---experimental) to resolve files from either [npm packages](https://docs.npmjs.com/getting-started/packages) or relative paths

```javascript

const {render} = require('node-sass');

const sassPackageImporter = require('sass-package-importer');

// ./relative.css: .title { color: green; }

const data = `

@import 'normalize.css';

@import 'relative';

`;

// `relative` is resolved but `normalize.css` is not resolved

render({data}, (err, {css}) => {

  css.toString();

  //=> '@import url(normalize.css);\n.title {\n  color: green ...'

});

// `normalize.css` is resolved and the rendered CSS includes contents of normalize.css

render({data, importer: sassPackageImporter}, (err, {css}) => {

  css.toString(); //=> '/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css ...'

});

```

## Installation

[Use](https://docs.npmjs.com/cli/install) [npm](https://docs.npmjs.com/getting-started/what-is-npm).

```

npm install sass-package-importer

```

## API

```javascript

const sassPackageImporter = require('sass-package-importer');

```

### sassPackageImporter

Type: `Function`

Once this function is passed to [`importer` option](https://github.com/sass/node-sass#importer--v200---experimental) of [node-sass](https://github.com/sass/node-sass)'s [`render` method](https://github.com/sass/node-sass#render-callback--v300), it checks if each [`@import`](https://sass-lang.com/documentation/file.SASS_REFERENCE.html#import) target can be resolved with [`require.resolve()`](https://nodejs.org/api/modules.html#modules_require_resolve_request_options).

If a target is resolvable and is neither JavaScript nor JSON file, the `@import` will be inlined with the stylesheet in the resolved npm package. Otherwise `@import` is treated as usual.

## License

[ISC License](./LICENSE) © 2018 Shinnosuke Watanabe