webpack2 sass-loader @import fail

[brianephraim]

relevant package.json

"css-loader": "^0.26.1",
"sass-loader": "^4.1.0",
"webpack": "^2.1.0-beta.28",
 "webpack-stream": "^3.2.0"

relevant gulpfile contents

gulp.task('webpack', ['get-config', 'require-config'], function(){
  return gulp.src(config.paths.src.webpack)
  .pipe(plugins.plumber({errorHandler: onError}))
  .pipe(webpackStream({
    config: require('./webpack.config.js'),
    watch: true
  }, webpack);)
  .pipe(gulp.dest(config.paths.dest.webpack));
});

relevant webpack.config.module.loaders

    {
      test: /\.scss$/,
      loader: ExtractTextPlugin.extract({
        fallbackLoader: 'style-loader',
        loader: [
          {
            loader: 'css-loader',
            query: {
              // modules: true,
              importLoaders: 2,
              sourceMap: true
            }
          },
          {
            loader: 'sass-loader',
            query: {
              outputStyle: 'expanded',
              sourceMap: true,
              sourceMapContents: true,
              // includePaths: [
              //   appRootDir + '/node_modules/bootstrap-sass/assets/stylesheets'
              // ]
            }
          }
        ]
      }

test.scss

@import 'test2';
body{background:red}

test2.scss

body{font-size:12px}

require from entry.js

require('./test.scss')

Gulp logs this strange error, and build fails

undefined:0

TypeError: undefined is not a function

If I comment out @import 'test2'; from test.scss, the build succeeds.

I believe the issue lies with webpack-stream because I can create a successful build if I take it out of the equation with a test task like this:

gulp.task('test-webpack-without-stream', function(cb){
  webpack(require('./webpack.config.js'));
});

[mpigsley]

@defualt did you ever get this working?

[brianephraim]

No, I replaced webpack-stream with a simpler Webpack/Gulp integration like this.

gulp.task('webpack', function(cb){
  webpack(require('./webpack.config.js'));
});

This is fine for development, but I will need more features when I write my production build task.

[mpigsley]

@defualt Just figured it out. I had to install the correct version of node-sass. In my case I had to downgrade to 3.8.0.

[Guobacai]

I got the same issue on: sass-loader: 6.0.5 webpack: 2.4.1

Here is the config of scss:

{
        test: /\.scss$/,
        use: extractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            'css-loader',
            'sass-loader'
          ],
          publicPath: env.DIST
        })
}