Why is my gulpfile causing only a sporadic css inject?

Question

The following gulp tasks work for some css files, but not for others. My global styles are injected on save as desired, but my roadmap.css file is not (needs a hard refresh).

How could I debug/solve this?

var settings = {
...
  sass_files: "applications/**/*.sass",
  css_files: "applications/**/*.css"
...

  }

var public_dir = "dist/"

gulp.task('build-sass', function() {
  return gulp.src(settings.sass_files)
    .pipe(changed(public_dir, { extension: '.css' }))
    .pipe(sass({
      errLogToConsole: true,
      includePaths: [
        "applications/_shared_assets/vendor/bootstrap-sass",
        "applications/_shared_assets/vendor/bootstrap-sass/assets/stylesheets",
        "applications/_shared_assets/vendor/bootstrap-sass/bootstrap-sass-custom",
        "applications/_shared_assets/vendor/bourbon/app/assets/stylesheets",
        "applications/_shared_assets/features",
        "applications/_shared_assets/css"
      ]
    })
  )
    .pipe(prefix(['last 15 versions', '> 1%', 'ie 8', 'ie 7'], { cascade: true }))
    .pipe(gulp.dest(public_dir))
    .pipe(browserSync.reload({ stream: true }));
});

gulp.task('build-css', ['build-sass'], function() {
  return gulp.src(settings.css_files)
    .pipe(gulp.dest(public_dir))
});

gulp.task('css-rebuild', ['build-css'], function() {
});


gulp.task('watch', ['browser-sync'], function() {
...
  gulp.watch(settings.sass_files, ['css-rebuild']);
...
});

The page for which the global styles are properly injected, and for which the roadmap file is not.

link(rel="stylesheet", href="portfolioroadmap.css")
link(rel="stylesheet", href="../_shared_assets/css/global_styles.css")

These are both generated by build-sass. I'd love any help, been stuck on this for hours now.

Answer 1

For future reference, although browsers are not sensitive to upper/lowercase: gulp is.

Make sure the reference in the .html has the same case as the filename in your filesystem (it was portfolioroadmap.css in my case rather than PortfolioRoadmap.css).