Question

我的项目结构：

project
  assets
    scripts
    styles
      foundation
        _settings.scss
      app.scss
  bower_components
  node_modules
  public
    css
      app.min.css
    js
  bower.json
  gulpfile.js
  package.json

我使用gulp-sass将app.scss编译为app.min.css，我希望基础scss文件包含在我的app.scss中

这是gulpfile.js：

gulp.task('styles', function() {
    return gulp.src('./assets/styles/app.scss')
    .pipe(sass({
        includePaths: ['./bower_components/foundation/scss']
    }))
    .pipe(autoprefixer({
        browsers: ['last 2 versions']
    }))
    .pipe(concat('app.min.css'))
    .pipe(minifyCss())
    .pipe(gulp.dest('./public/css'))
    .pipe(connect.reload());
});

app.scss：

@import 'foundation/settings';
@import 'foundation';

当我更改_settings.scss然后运行gulp时，所有更改都会保存并编译。但是当gulp正在观看app.scss并且我在_settings.scss中更改了某些内容时出现以下错误：

Error: assets\styles\app.scss
  1:9  file to import not found or unreadable: foundation/settings
Current dir:
    at options.error (D:\Dropbox\foundation-project\node_modules\gulp-sass\node_modules\node-sass\lib\index.js:276:32)

最令人困惑的事情是，当我运行gulp时，有时候我会得到同样的错误，有时即使gulp正在使用app.scss，我也不会得到这个错误

Answer 1

您的项目将编译并运行。

我在phpStorm上接受相同的警报并且它渲染得很好，但是在某一点上基础框架css没有加载。要解决此问题，我执行了以下操作：

1） settings.scss在线添加'' - @ import“foundation / _functions”; 2）在app.scss中添加以下导入：@import'aoundation';

错误：要导入的文件未找到或不可读：基础

1 个答案: