webpack 没有生成css,Webpack只生成JS，没有来自SCSS的CSS文件

在我的项目中，我使用带有React和NodeJS的Webpack。我想生成一个bundle.js和style.css文件。目前，我有下面的代码：Webpack只生成JS，没有来自SCSS的CSS文件

var webpack = require('webpack')

var ExtractTextPlugin = require('extract-text-webpack-plugin')

module.exports = {

entry: './index.js',

output: {

path: 'public',

filename: 'bundle.js',

publicPath: ''

},

module: {

loaders: [

{

test: /\.js$/,

exclude: /node_modules/,

loader: 'babel-loader',

query: {

presets: ['react', 'es2015']

}

},

{ test: /\.scss$/, loader: ExtractTextPlugin.extract('css!sass') }

]

},

plugins: [

new ExtractTextPlugin('public/style.css')

]

}

但是当我运行webpack只有JS文件在./public地图创建：

Asset Size Chunks Chunk Names

bundle.js 844 kB 0 [emitted] main

+ 222 hidden modules

下面的例子/教程它只是面向于CSS文件或明显的错误，就像不执行ExtractText一样。 我也下载了包sass-loader node-sass。在一些例子中，我确实发现了那些包含的软件包，有些则没有。

EDIT(需要index.js风格)：

import React from 'react'

import { render } from 'react-dom'

import { Router, browserHistory } from 'react-router'

import routes from './modules/routes'

require('./public/style.css')

render(

,

document.getElementById('app')

)

EDIT(webpack.config.js)：

module: {

loaders: [

{

test: /\.js$/,

exclude: /node_modules/,

loader: 'babel-loader',

query: {

presets: ['react', 'es2015']

}

},

{

test : /\.scss$/,

include : path.join(__dirname, './public/sass'),

loaders : ["style", "css", "sass"]

},

{

test: /\.scss$/,

loader: ExtractTextPlugin.extract('css!sass')

}

]

},

sassLoader: {

includePaths: [path.join(__dirname, './public/sass')]

},

plugins: [

new ExtractTextPlugin(path.join(__dirname, './public/style.css'))

]

我的文件夹结构如下所示：

webpack.config.js

index.js

/public

index.html

bundle.js (generated)

/sass

style.scss

basics.scss (imported in style.scss)

2016-03-14

ronnyrr