Sass in webpack creates both .css and .js file?

Consider the following config:

const path = require('path');
const LodashModuleReplacementPlugin = require('lodash-webpack-plugin');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
  entry: {
    event: './widgets/events/app.js',
    lumin_widget_styles: './widgets/sass/lumin-core.scss'
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].widget.js'
  },
  target: 'web',
  node: {
    console: true,
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
  },
  module: {
    rules: [
      {
        test: /.js?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: {
          plugins: ['lodash'],
          presets: [['es2015', {'modules': false}]]
        }
      },
      {
        test: /\.marko$/,
        loader: 'marko-loader'
      },
      {
        test: /\.(scss|sass)$/,
        loader: ExtractTextPlugin.extract(['css-loader', 'sass-loader'])
      }
    ],
  },
  plugins: [
    new LodashModuleReplacementPlugin,
    new webpack.optimize.OccurrenceOrderPlugin,
    new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en/),
    new ExtractTextPlugin({
      filename: '[name].css',
      allChunks: true
    })
  ],
};

This works as expected with one issue:

As you can see we have an event.js (good), lumin_widget_style.css (excellent), lumin_widget_style.js (horribly bad).

• Why is it creating: lumin_widget_style.js I followed, more or less, this guys example of using sass with webpack and so far so good, accept for the unexpected javascript file.

We do not have an app.js, we have multiple widgets, so there will be multiple .js files in the dist, but one .css file.

Can some one shed some light on this situation? and a solution?

via TheWebs