使用@use导入Bootstrap Sass时出现「无法找到样式表」报错

关键修复步骤 #

你的问题核心是Dart Sass默认不会自动扫描node_modules目录查找依赖，同时你的gulpfile存在两处必要缺失：

1. 未导入gulp核心模块
2. 未给sass()配置includePaths参数指定依赖搜索目录

修改后的完整gulpfile.js：

const gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));

function css() {
    return gulp.src('test.scss')
        .pipe(sass({
            includePaths: ['./node_modules'] // 告诉Sass去node_modules找依赖
        }).on('error', sass.logError))
        .pipe(gulp.dest('dist'));
}

exports.css = css;
exports.default = css;

test.scss中的导入语句保持不变即可：

@use "bootstrap/scss/bootstrap";

（若仍有问题，可尝试添加后缀明确指定文件：@use "bootstrap/scss/bootstrap.scss";）

常见误区排查 #

• 你提到尝试过设置includePaths，大概率是配置位置错误或路径写法问题（使用./node_modules可确保跨Windows/Linux平台兼容）
• 原始gulpfile未导入gulp模块，虽不会直接触发Sass导入错误，但会导致gulp任务无法正常初始化，属于隐性bug

验证与兜底方案 #

1. 确认依赖文件存在：

# Linux/macOS
ls node_modules/bootstrap/scss/bootstrap.scss

# Windows
dir node_modules\bootstrap\scss\bootstrap.scss

2. 清理损坏依赖并重装：

# Linux/macOS
rm -rf node_modules package-lock.json
npm install

# Windows
rmdir /s/q node_modules && del package-lock.json
npm install

内容的提问来源于stack exchange，提问作者James