Name: sass-module-importer
Owner: AutoScout24
Owner: AutoScout24
Description: Simple importer for node-sass to import npm and bower modules
Forked from: lucasmotta/sass-module-importer
Created: 2017-01-03 16:02:22.0
Updated: 2017-01-03 16:02:25.0
Pushed: 2017-01-04 08:58:39.0
Homepage: null
Size: 33
Language: JavaScript
GitHub Committers
User | Most Recent Commit | # Commits |
---|
Other Committers
User | Most Recent Commit | # Commits |
---|
Simple importer for node-sass to import npm and bower modules.
Say good-bye to all the mess with relative paths on your Sass files.
You can now import your Sass/SCSS modules by referencing to the module name, like this:
ort "sass-easing";
ort "quantum-colors";
ort "inuit-defaults";
ort "inuit-functions";
ort "inuit-mixins";
ort "inuit-box-sizing";
ort "inuit-normalize";
ort "inuit-page";
)
Just for comparison, look at this mess:
ort "node_modules/sass-easing/_easings.scss";
ort "bower_components/quantum-colors/_quantum-colors.scss";
ort "bower_components/inuit-defaults/settings.defaults";
ort "bower_components/inuit-functions/tools.functions";
ort "bower_components/inuit-mixins/tools.mixins";
ort "bower_components/inuit-normalize/generic.normalize";
ort "bower_components/inuit-box-sizing/generic.box-sizing";
ort "bower_components/inuit-page/base.page";
(
Assuming that the external library you are installing fits under one of those categories:
index.css
file on the root of their moduleThis tool it will also inline CSS files for you, since Sass cannot import plain CSS files yet. So if the dependency you are using exports a CSS file, it will work too.
install sass-module-importer --save-dev
>= v3.0.0
rt sass from 'node-sass';
rt moduleImporter from 'sass-module-importer';
.render({
le: './source/css/app.scss',
porter: moduleImporter()
b);
rt gulp from 'gulp';
rt sass from 'gulp-sass';
rt moduleImporter from 'sass-module-importer';
.task('style', () => {
turn gulp.src('./source/css/app.scss')
.pipe(sass({ importer: moduleImporter() }))
.pipe(gulp.dest('./public/css'));
If you need to import partials from your external module, just use the path for the partial you want to import. To import the following file:
_modules/module-name/folder/to/_file.scss
Import like this anywhere:
ort "module-name/folder/to/_file.scss"
You can pass any option supported by node-resolve directly, like this:
leImporter({ basedir: path.join(__dirname, 'another-folder') });
Use npm test
to run the tests.
If you discover a bug, please raise an issue on Github. https://github.com/lucasmotta/sass-module-importer/issues
The source code and the test are written in ES6 (ECMAScript 2015).
Buble is being used to compile to ES5 before the package is published to npm.