sass-variable-loader
npm i sass-variable-loader

sass-variable-loader

Sass variable loader for webpack

by nordnet

0.1.2 (see all)License:MITTypeScript:Not Found
npm i sass-variable-loader
Readme

Sass variable loader for webpack

Parses your Sass variables and returns an object containing each variable camelCased and the end value as it would be in CSS.

That means full support for Sass' lighten, darken, mix etc.

Input:

$gray-base: #000 !default;
$gray-darker: lighten($gray-base, 13.5%) !default; // #222
$gray-dark: lighten($gray-base, 20%) !default; // #333
$gray: lighten($gray-base, 33.5%) !default; // #555
$gray-light: lighten($gray-base, 46.7%) !default; // #777
$gray-lighter: lighten($gray-base, 93.5%) !default; // #eee

Result:

{
  grayBase: '#000',
  grayDarker: '#222222',
  grayDark: '#333333',
  gray: '#555555',
  grayLight: '#777777',
  grayLighter: '#eeeeee'
}

Installation

npm install --save-dev sass-variable-loader

Usage

import variables from 'sass-variable-loader!./_variables.scss';
// => returns all the variables in _variables.scss as an object with each variable name camelCased

Note: If you've already defined loaders for Sass files in the configuration, you can override the loader order by writing !!sass-variable-loader!./_variables.scss to disable all loaders specified in the configuration for that module request.

Options

You can pass options to the loader via query parameters.

preserveVariableNames

import variables from 'sass-variable-loader?preserveVariableNames!./_variables.scss';
// => returns all the variables in _variables.scss as an object with each variable name left intact

License

MIT (http://www.opensource.org/licenses/mit-license.php)

Downloads/wk

3.8K

GitHub Stars

100

LAST COMMIT

5yrs ago

MAINTAINERS

4

CONTRIBUTORS

3

OPEN ISSUES

5

OPEN PRs

2
VersionTagPublished
0.1.2
latest
5yrs ago
No alternatives found
No tutorials found
Add a tutorial