You can create a partial in your SCSS file.

Then add your import in app.scss

This is the part that is confusing me

 don't want to include it in app.scss because most of my pages don't need it.

Are you trying to only include this CSS on certain pages?

Yes! I only want to include this "component" CSS on some pages, not all pages. Including it on all pages is what will happen if I @import it in app.css, correct?

Ok, so you can add a CSS file into your project assets folder. Since it will not be compiled, you'll link up the path to the stylesheet directly. You'll want to have the CSS file copied into the dist folder.

In the Gulpfile, you can create a copy task that moves the file over.

Okay, so looking at gulpfile.babel.js and going by what you are saying, it looks like that functionality is already in there:

// Copy files out of the assets folder
// This task skips over the "img", "js", and "scss" folders, which are parsed separately
function copy() {
  return gulp.src(PATHS.assets)
    .pipe(gulp.dest(PATHS.dist + '/assets'));
}

That looks to me like if I place my slideshow.css in the top level of /src/assets/ , gulp will give me /dist/assets/slideshow.css -- giving me a link I can code into my layouts variation.

I didn't think to look in the gulpfile! Many thanks; I'll try that out!