Webpack 3 Sass Loader Fehler nach dem Aufbau

Question

Ich benutze die neueste Version von Webpack 3.4.1 mit Sass Loader und extrahieren Text-Plugin, um eine statische CSS-Datei aus der Sass-Quelle zu generieren. Es wird auf meinem Dev-Server geladen, und ich kann die CSS-Datei sehen, bekomme aber einen Konsolenfehler 'Uncaught SyntaxError: Unexpected Token', der in der ersten Zeile auf die CSS-Datei @ body {color: # 000} zeigt.

Meine Webpack-Konfiguration ist unten. Jede Hilfe wird sehr geschätzt.

const path = require('path'); 
const webpack = require('webpack'); 

const ExtractTextPlugin = require('extract-text-webpack-plugin'); 

module.exports = { 
    context: path.resolve(__dirname, ''), 
    entry: { 
    app: './src/js/app.js', 
    }, 
    output: { 
    filename: '[name].bundle.js', 
    path: path.resolve(__dirname, './dist/assets'), 
    publicPath: '/assets', 
    }, 
    devServer: { 
    contentBase: path.resolve(__dirname, './src'), // New 
    }, 
    module: { 
    rules: [{ 
     test: /\.js$/, 
     exclude: [/node_modules/], 
     use: [{ 
      loader: 'babel-loader', 
      options: { 
      presets: ['es2015'] 
      }, 
     }], 
     }, 
     { 
     test: /\.(svg|gif|png|eot|woff|ttf)$/, 
     use: [{ 
      loader: 'url-loader' 
     }] 
     }, 
     { 
     test: /\.scss$/, 
     use: ExtractTextPlugin.extract({ 
      fallback: 'style-loader', 
      use: ['css-loader', 'sass-loader'] 
     }) 
     } 
    ], 
    }, 
    plugins: [ 
    new ExtractTextPlugin({ 
     filename: '[name].bundle.css', 
     allChunks: true, 
    }), 
    ], 
}; 

Answer 1

Warum Sie nicht über einen externen Compiler von Sass zu CSS verwenden, wird es schneller und einfacher zu Ihnen, und Sie werden nur CSS-Loader auf Ihrem webpack config, Sie mehrere Programm Compiler aus Sass zu Css wie (Kompass, Prepros) Prepros ist so gut, Ich benutze diese Weise und habe kein Problem bei ihr