Can't load the entire scss of Foundation 6 with Webpack

Question

I try to load Foundation 6 scss with Webpack.

Here's my very simple main.scss file:

@import '~foundation-sites/scss/foundation';

body {
  background-color: red;
}

Here's the call in my app.js:

import './main.scss';  //webpack syntax

And here's my webpack.config.js:

var webpack = require("webpack");

module.exports = {

    context: __dirname + '/src',
    entry: './app/app.js',

    resolve: {
        root: [__dirname + "/src"],
        moduleDirectories: [__dirname + '/node_modules']
    },

    externals: {
        jQuery: 'jQuery',
        foundation: 'Foundation'
    },

    module: {
        loaders: [
            {
                test: /\.js$/, exclude: /node_modules/,
                query: {
                    presets: ['es2015']
                },
                loader: "babel"
            },
            {test: /\.scss$/, loader: 'style!css!sass!'},
            {test: /\.html$/, exclude: /node_modules/, loader: "raw"}

        ]
    },

    // support source maps
    devtool: "#inline-source-map"

};

After running webpack-dev-server --content-base src/, the resulting index.html file contains this:

Why are there only the initial comments of Foundation's scss ?
May it be a bug of sass-loader?

I can't load all the entire Foundation's scss file.