Sass @use 'bootstrap/scss/bootstrap' failing with 'Can't find stylesheet to import' in minimal project
14:03 04 Mar 2025

I'm encountering a persistent issue where Sass is unable to resolve the import path for Bootstrap, even in a minimal test project. I'm using gulp-sass with Dart Sass.

Here's the problem:

I'm trying to import Bootstrap's main Sass file (bootstrap.scss) using @use "bootstrap/scss/bootstrap"; in my test.scss file. However, Sass keeps throwing the error:

Error in plugin "sass"
Message:
    test.scss
Can't find stylesheet to import.
  ╷
1 │ @use "bootstrap/scss/bootstrap";
  │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  - 1:1  root stylesheet

Steps to Reproduce:

  1. Create a new directory: mkdir sass_test && cd sass_test
  2. Initialize NPM: npm init -y
  3. Install dependencies: npm install gulp gulp-sass sass bootstrap
  4. Create gulpfile.js:
    const sass = require('gulp-sass')(require('sass'));
    
    function css() {
        return gulp.src('test.scss')
            .pipe(sass().on('error', sass.logError))
            .pipe(gulp.dest('dist'));
    }
    
    exports.css = css;
    exports.default = css;
  1. Create test.scss:
    @use "bootstrap/scss/bootstrap";

body {
    background-color: lightgreen;
}
  1. Run gulp: gulp

Expected Result: The Sass compilation should succeed, and a dist/test.css file should be created.

Actual Result: I get the "Can't find stylesheet to import" error.

What I've Tried:

  • Verified file existence: I've confirmed that node_modules/bootstrap/scss/bootstrap.scss exists.
  • Corrected import paths: I've tried various import paths, including relative paths (../node_modules/...) and direct module paths (bootstrap/scss/...).
  • Explicit includePaths: I've added includePaths: [path.resolve(__dirname, 'node_modules')] to my gulp-sass options.
  • Cleared npm cache and reinstalled dependencies: I've deleted node_modules and package-lock.json and reinstalled all packages.
  • Checked node_modules structure: The node_modules folder appears to be correctly structured.
  • Reinstalled gulp-sass and sass: I've reinstalled these packages. Verified Node.js and npm versions: I'm using current versions.
  • Checked for conflicting global installations: I've checked for and uninstalled global sass installations.

Environment:

  • Operating System: Windows 11
  • Node.js version: 23.7.0
  • npm version: 11.1.0
  • gulp version: ^5.0.0
  • gulp-sass version: ^6.0.0
  • sass version: ^1.85.1
  • bootstrap version: ^5.3.3

Additional Details:

  • I have verified that the node_modules/bootstrap/scss/bootstrap.scss file does exist.
  • I have created the test project in a completely separate folder from my main project.
  • I'm at a loss as to what could be causing this. Any help would be greatly appreciated.

Edit: Confirmed this happens on Ubuntu as well.

node.js sass gulp bootstrap-5 gulp-sass