从gulp-sass转换为webpack 2 sass-loader

我正在从gulp/jspm迁移到webpack。我们的SASS似乎一切正常。我们的任务看起来像这样：从gulp-sass转换为webpack 2 sass-loader

var gulp = require('gulp'); 
var sourcemaps = require('gulp-sourcemaps'); 
var sass = require('gulp-sass'); 
var autoprefixer = require('autoprefixer'); 
var paths = require('../paths'); 
var flatten = require('gulp-flatten'); 
var postcss = require('gulp-postcss'); 

gulp.task('build-sass',() => { 
    return gulp.src(paths.sassSource) 
    .pipe(sourcemaps.init()) 
    .pipe(sass().on('error', sass.logError)) 
    .pipe(postcss([autoprefixer()])) 
    .pipe(flatten()) 
    .pipe(sourcemaps.write('/maps')) 
    .pipe(gulp.dest(paths.output + 'css')); 
});

因此完美地工作。这是SASS我目前的WebPack配置：

{ 
     test: /\.scss$/, 
     loader: ExtractTextPlugin.extract({ 
     fallbackLoader: 'style-loader', 
     loader: 'css-loader?sourceMap!postcss-loader!sass-loader?sourceMap', 
     }), 
    },

而在插件我：

new ExtractTextPlugin({ 
      filename: 'global.css', 
      allChunks: true, 
     }),

问题是，当我运行的WebPack我得到这些SASS错误：

ERROR in ./~/css-loader?sourceMap!./~/postcss-loader!./~/sass-loader?sourceMap!./src/sass/base/_QB4-variables.scss 
    Module build failed: 
    $never-signed-in: $gray-light; 
        ^
      Undefined variable: "$gray-light". 
      in /Users/allen/work/TwentyTwenty.QualBoard.Web/src/sass/base/_QB4-variables.scss (line 31, column 19)

我收到了那些我不明白的类型的错误，因为这些漏洞工具从未抛出过这些错误。我觉得缺少一些配置。

来源

2017-01-09 allencoded

在我的main.js文件中，我错过了我的sass include。因此，它只是编译所有的文件，但没有特别的顺序。

来源

2017-01-09 19:59:26 allencoded

从gulp-sass转换为webpack 2 sass-loader

回答

相关问题