webpack fails “module build failed: unknown word” with webpack.config.js file

Question

webpack does not work for me when trying to add css using the css-loader.

os: Windows 10 pro, webpack: 4.8.0 node: 8.9.4 npm: 6.0.0 css-loader: 0.28.11 style-loader

Answer 1

Have check these issues getting similar issues in my web pack project You have to check the web pack rule :

{
    test: /\.(s*)css$/,
    use: [
      'style-loader',
      'css-loader',
      'sass-loader'
    ]
  }

Above, updated the rule it will handle our sass or CSS files. The test is test: /.(s*)css$/ : which means any file having name matching with regular expression /.(s*)css$/i.e. .scss or .css

It should be compiled with the chain of loaders specified in the use array i.e. ['style-loader', 'css-loader', 'sass-loader'].

This rule chain the output of sass-loader to css-loader. css-loader will take this css output of sass-loader and will also process any other .css files we have in our application and pass on the .css to style-loader, which will then do the job of putting the css codes inside tags in our index.html,It work bottom to top..