'How to stop webpack from creating .js files even for scss entries?

I want to compile standalone scss files with webpack (and yes, even js files, but not scss files into js ones..):

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

module.exports = {
  mode: 'development',
  watch: true,
  
  entry: {
    shared: './src/shared.js',
    front_page: './src/front-page.js',
    front_page_style: '../scss/front-page.scss',
  },

  output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist'),
  },

  module: {
    rules: [
      {
        test: /\.scss$/,
        exclude: /node_modules/,
        use: [
          {
            loader: 'file-loader',
            options: { name: '../../css/[name].css' }
          },
          'sass-loader'
        ]
      }, // babel

    ] // rules
  } // module
};

The above code will generate .css files correctly, but will also generate /dist/*.js files from the scss entries (ex. front_page_style.js).

How to avoid this behaviour?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source