question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

IncludePaths not working

See original GitHub issue

I can’t get includePaths working on version 2.3.2 of gulp-sass and 4.4.2 of node.

Here’s my gulpfile contents:

const SASS_FILES = ['./code/styles/main.scss'];
const SASS_INCLUDE_PATHS = [
  path.join(__dirname, '/node_modules/normalize-scss/sass/'),
  path.join(__dirname, '/node_modules/bourbon/app/assets/stylesheets/'),
  path.join(__dirname, '/node_modules/bourbon-neat/app/assets/stylesheets/'),
  path.join(__dirname, '/node_modules/susy/sass/')
];

gulp.task('styles', function() {
  return gulp.src(SASS_FILES)
    .pipe(sass({ includePaths: SASS_INCLUDE_PATHS }))
    .pipe(gulp.dest(BUILD_DEST));
});

The task runs without error, and scss files I have within ./code/styles/ are pulled in just fine, but it seems the includePaths imports are completely ignored. If I strip my main.scss back to the following, for example:

@import 'normalize';
// @import 'bourbon';
// @import 'neat';
// @import 'susy';

My output is a completely blank file.

Interestingly, if I import bourbon and neat I do get something in my output, just not what I’d expect:

html {
  box-sizing: border-box; }

*, *::after, *::before {
  box-sizing: inherit; }

Importing susy, again, yeilds no extra css added to the output.

Any advice anyone could offer would be much appreciated.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:2
  • Comments:26

github_iconTop GitHub Comments

1reaction
fredericpfisterercommented, Jul 1, 2016

nevermind, I fixed it. It is because normalize scss needs @include normalize();

1reaction
fredericpfisterercommented, Jun 30, 2016

I also have an issue using includePaths. I’m using bower dependencies.

includePaths: ['bower_components/normalize-scss/sass']

Any ideas ?

Read more comments on GitHub >

github_iconTop Results From Across the Web

IncludePath not working in current version · Issue #668 - GitHub
Hi Team, Reason : It's works with old node-sass 4.7.2, but it doesn't work in node-sass 4.8.1 latest version. Can you please provide...
Read more >
angular.json includePaths is not workings for node_modules
I have an angular library with styles that I want to use as if they were part of the application. I tried using...
Read more >
How to configure includePaths for SASS on Mix? - Laracasts
I was able to workaround my own problem with font-awesome by using the following code. But I tried hard and wasn't able to...
Read more >
webpack: provide support for sass-loader `includePath` property
In my webpack config I have this: { loader: 'sass-loader', options: { sourceMap: true, includePaths: [path.resolve('./src/js/components')], outFile: 'xx' }
Read more >
How to simplify and clean your sass import with Angular.json
When we work with Sass and Angular, import files is a very common task, ... add stylePreprocessorOptions object with includePaths option and ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found