Webpack sass-loader Invalid CSS -

i error whenever running build.

invalid css after "module.exports": expected "{", '= "data:text/x-scss' 

i've tried using vanilla js webpack config , same error, it's not typescript config. tried extract-text-webpack-plugin same error. actual app working fine, has no css. here config.

import * path 'path'; import * webpack 'webpack'  const config: webpack.configuration = {     entry: {         app: ['./js/main.ts']     },     output: {         path: path.resolve(__dirname, './dist/js'),         filename: '[name].js'     },     module: {         rules:[             {                 test: /\.html$/,                 loader: 'ngtemplate-loader?prefix=/&module=app&relativeto=' + (path.resolve(__dirname, './js/app')) + '/!html-loader'             },             {                 test: /\.ts$/,                 loader: 'awesome-typescript-loader'             },             {                 test: /\.(sass|scss|ttf|svg|woff)$/,                 use: [{                     loader: "style-loader"                 }, {                     loader: "css-loader"                 }, {                     loader: "sass-loader",                 }, {                     loader: "url-loader"                 }]             }         ]     } }  export default config 

and here snippet of main sass file.

@import "utilities/variables"; @import "utilities/animations"; @import "utilities/helpers"; 

which imported in main app file with:

import '../sass/sass.scss'; 

i think error because use url-loader sass files somehow. split webpack.config rule (sass|scss|ttf|svg|woff) looks this:

{   test: /\.(ttf|svg|woff)$/,   use: [{     loader: "url-loader"   }] }, {   test: /\.(sass|scss)$/,   use: [{     loader: "style-loader"   }, {     loader: "css-loader"   }, {     loader: "sass-loader",   }] }