Webpack i Foundation framework

Question

Hej,

Robię aplikację na reactjs. Mam problem z importem frameworka foundation-sites z node_modules w mojej aplikacji.

Chciałbym sobie stworzyć katalog scss w katalogu mojej aplikacji i tam tworzyć moje style mając zaimportowane style foundation.

Niestety nie mogę rozgryźć w jaki sposób te style zaserwować przez webpacka.

Moja konfiguracja wygląda na ten moment tak:

var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
var path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin')

module.exports = {
  context: path.join(__dirname, "src"),
  devtool: debug ? "inline-sourcemap" : null,
  entry: "./js/index.js",
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: {
          presets: ['react', 'es2015', 'stage-0'],
          plugins: ['react-html-attrs', 'transform-decorators-legacy', 'transform-class-properties'],
        }
      },
     // fonts and svg
      { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff" },
      { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff" },
      { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/octet-stream" },
      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file" },
      { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=image/svg+xml" },
      {
        // images
        test: /\.(ico|jpe?g|png|gif)$/,
        loader: "file"
      },
      {
        // for some modules like foundation
        test: /\.scss$/,
        exclude: [/node_modules/], // sassLoader will include node_modules explicitly
        loader: ExtractTextPlugin.extract("style", "css?sourceMap!postcss!sass?sourceMap&outputStyle=expanded")
      },
      {
        test: /\.css$/,
        loader: ExtractTextPlugin.extract("style", "css?sourceMap!postcss")
      }
    ]
  },
  output: {
    path: __dirname + "/src/",
    filename: "index.min.js"
  },
  plugins: debug ? [] : [
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
   new ExtractTextPlugin("app.css")
  ],
  sassLoader: {
    includePaths: [path.resolve(__dirname, "node_modules")]
  }
};

Struktura katalogów:

-frontend
   -node_modules
   -src
      -css
         -tutaj chcialbym kompilowac cssy
      -img
      -js
      -scss
         -app.scss
      index.html
   package.json
   webpack.config.js

W index.html mam po prostu link do css/app.css

Czy ktoś kiedyś miał podobny problem i mógłby podpowiedzieć co robię źle ?

Z góry dzięki.