M
M
MFT2020-07-18 20:08:52
Sass
MFT, 2020-07-18 20:08:52

Webpack: how to fix Module parse failed: Unexpected token error?

Hello! This is my first time trying to use sass. Setting up webpack:

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

module.exports={
  entry:'./src/index.js',
  output:{
    filename:'bundle.js',
    path:path.resolve(__dirname, 'dist')
  },
  module: {
  rules: [
    {
      test: /\.scss$/,
      use: ExtractTextPlugin.extract({
        fallback: 'style-loader',
        use: ['css-loader', 'sass-loader']
      })
    }
  ]
},
plugins: [
 new ExtractTextPlugin('style.css')
],
resolve: {
    extensions: ['.js', '.scss']
}
}


scss and js files are in the same folder (src).
scss included in input index.js:
import './src/base.scss'
When I run webpack I get an error:
ERROR in ./src/base.scss 1:9
Module parse failed: Unexpected token (1:9)
You may need an appropriate loader to handle this file type, currently no loader
s are configured to process this file. See https://webpack.js.org/concepts#loade
rs
> $bg-color: pink;
|
| body {
@ ./src/index.js 1:0-20

Answer the question

In order to leave comments, you need to log in

1 answer(s)
J
Just Me, 2020-07-18
@Just__Den

ExtractTextPlugin depricated use MiniCssExtractPlugin

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question