sass-loader with extract-text-plugin not outputting file - css

Question

I have configured my webpack.config.js as following:
var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
var path = require('path');
// plugins
var ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = {
context: path.join(__dirname, "src"),
devtool: debug ? "inline-sourcemap" : null,
entry: "./js/init.js",
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel',
query: {
presets: ['react', 'es2015', 'stage-0'],
plugins: ['react-html-attrs', 'transform-decorators-legacy', 'transform-class-properties',],
}
},
{
test: /\.json$/,
include: /node_modules/,
loader: 'json-loader'
},
{
test: /\.scss$/,
loaders: ExtractTextPlugin.extract(
'style',
'css!sass'
)
}
]
},
output: {
path: __dirname + "/src/",
filename: "app.js"
},
plugins: debug ? [] : [
new webpack.optimize.DedupePlugin(),
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
new ExtractTextPlugin('default.css'),
],
devServer: {
port: 3000,
historyApiFallback: {
index: 'index.html'
}
},
sassLoader: {
includePaths: [path.resolve(__dirname, "src/css/sass")]
},
resolve: {
alias: {
'#': path.resolve(__dirname, 'src/js'),
'!': path.resolve(__dirname, 'src/css/sass')
}
},
};
And this is my file structure:
- src
-- css
--- sass
---- default.scss
-- js
-- index.html
Yet I don't see my default.css file exported anywhere when I run webpack dev server. Does it not work with webpack dev server?
Edit: Simply running webpack does not work either.