Javascript 基于webpack的Scss提取

我正在尝试使用ExtractTextPlugin将我的SCS提取并转换为css，并将其与client.min.js一起移动到

src

文件夹，但当前在构建webpack.config.js文件时遇到以下问题：

./scss/styles.js中出现错误 未找到模块：错误：无法解析C:\Users\ajoku\Desktop\Web Projects\learn2node\http\scss中的模块“main.scss” @./scss/styles.js 3:0-20

我的webpack.config.js文件：

"use strict";
var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
var path = require('path');
let ExtractTextPlugin = require('extract-text-webpack-plugin');
let extractSCSS = new ExtractTextPlugin('./scss/main.scss',{allChunks: true});
module.exports = {
  context: path.join(__dirname, "http"),
  devtool: debug ? "inline-sourcemap" : null,
  entry: {
    js:"./react/client.js",
    scss: "./scss/styles.js",},
  module: {
      loaders: [
        {
          test: /\.js?$/,
          exclude: /node_modules/,
          loader: 'babel-loader',
          query: {
            presets: ['react', 'es2015', 'stage-0'],
            plugins: ['react-html-attrs', 'transform-class-properties', 'transform-decorators-legacy']
          }},
        {test: /\.scss$/i, loader: ExtractTextPlugin.extract('css!scss')},
      ]
    },
  output: {
    path: "./src/",
    filename: "client.min.js"
  },
  plugins: debug ? [] : [
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
  ],
  plugins: [
    new ExtractTextPlugin('main.css', {
            allChunks: true
        })
  ]
};

My styles.js文件

require("main.scss");

我的scss文件与styles.js文件一起位于http/scss中

---

问题可能是由什么引起的？谢谢您的时间。

这可以通过sass loader和extract text webpack插件实现

webpack.config package.json

---

require（“./main.scss”）？正如我假设的，我不能只将SCS提供给webpack，所以我需要以其他方式导入它。
module.exports = {
  module: {
    {
      test: /\.scss$/,
      include: path.resolve(__dirname, 'http/scss'),
      loader: ExtractTextPlugin.extract('style', 'css?modules&localIdentName=[name]-[local]!autoprefixer!sass')
    }
  }
  plugins: [
    new ExtractTextPlugin('[name]-[hash].min.css')
  ]
}

"devDependencies": {
    "autoprefixer-loader": "^3.1.0",
    "css-loader": "^0.23.0",
    "node-sass": "^3.4.2",
    "sass-loader": "^3.1.2",
    "extract-text-webpack-plugin": "^0.9.1",
    "style-loader": "^0.13.0"
}