导入变量部分时偶尔出现 gulp-sass 'not found or unreadable' 错误

Question

每隔几次我编辑我的 _vars.scss 文件，gulp-sass watch 就会抛出错误

Error in plugin 'sass'
Message:
    sass\stylesheet.scss
Error: File to import not found or unreadable: vars
    Parent style sheet: stdin
    on line 10 of stdin
>> @import 'vars';
   ^

注释掉

行就可以重新编译了

@import 'vars';

这是我的代码

stylesheet.scss

//Settings
@import 'colors';
@import 'vars';

//External libs
@import 'font-awesome';
@import 'susy';
@import 'breakpoint';

//Global and default styles
@import 'global';

//sections
@import 'styles/header';
@import 'styles/main';
@import 'styles/footer';

_vars.scss

$font-heading: 'Oswald', sans-serif;
$font-paragraph: 'Raleway', sans-serif;

// Padding
$spacing: 5px;

@function spacing($size){
    @return $spacing * $size;
}

$footer-height: spacing(10);

$susy: (
    columns: 12,
    gutters: 1 / 4,
    // debug: (image: show)
);

Gulpfile,js

var gulp = require('gulp');
var util = require('gulp-util');
var replace = require('gulp-replace');
var browserSync = require('browser-sync').create();

var sass = require('gulp-sass');
var inclPaths = require('sass-include-paths');
var sourcemaps = require('gulp-sourcemaps');

var bower = require('gulp-bower');

var stylePaths = { 
    sass: './sass/**/*.scss',
    css: './css'
 }
var sassIncludes = []
    .concat(inclPaths.bowerComponentsSync());
var sassOptions = {
    style: 'expanded',
    includePaths: sassIncludes
}

var bowerDir = './bower_components';

var faPaths = {
    src: bowerDir + '/font-awesome/fonts/**.*',
    dest: 'fonts',
}

var vendorJS = {
    base: bowerDir,
    scripts: [bowerDir + '/jquery/dist/jquery.js'],
    dest: './js/vendor'
}

gulp.task('sass', function(){
    return gulp
        .src(stylePaths.sass)
        .pipe(sourcemaps.init())
        .pipe(sass(sassOptions).on('error', sass.logError))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest(stylePaths.css))
        .pipe(browserSync.stream({match: '**/*.css'}));
});

gulp.task('watch', ['sass'], function(){

    browserSync.init({
        proxy: 'mysite.local'
    });

    gulp.watch(stylePaths.sass, ['sass']);
    gulp.watch('./*.html').on('change', browserSync.reload);
});

gulp.task('bower', function(){
    return bower()
        .pipe(gulp.dest(bowerDir));
});

gulp.task('faFonts', function(){
    return gulp.src(faPaths.src)
        .pipe(gulp.dest(faPaths.dest));
});

gulp.task('vendorScripts', function(){
    return gulp.src(vendorJS.scripts, {base: vendorJS.base})
        .pipe(gulp.dest(vendorJS.dest));
})

gulp.task('default', ['watch']);

Answer 1

我已经阅读了很多有关此错误的信息，这通常是因为 sublime text 和使用了 windows 机器。如果您已经有了这些设置，则必须进入 sublime 首选项，然后 "Settings - User" 并添加另一个选项 "atomic_save": true。您可以对此进行更多研究，因为有很多人遇到此问题。

设置代码 - 用户：

{
    "color_scheme": "Packages/Color Scheme - Default/Twilight.tmTheme",
    "font_size": 9,
    "atomic_save": true
}

此致。

导入变量部分时偶尔出现 gulp-sass 'not found or unreadable' 错误

Ocasional gulp-sass 'not found or unreadable' error when importing variable partial

import

sass

gulp

gulp-sass