title: Webpack how to compile all my scss file without generating the useless same-name js file
body: <p>I use webpack ^5.65.0.</p>
  <p>I want to compile all my scss file into css but I have to use multiple <code>import</code> in my entry <code>index.js</code> like</p>
  <pre><code>import './index.scss';
  import './test.scss'
  ...
  </code></pre>
  <p>I do not want to use import in the <code>index.js</code> file and think it can be done by webpack settings(I am not sure).</p>
  <p>My <code>webpack.config.js</code></p>
  <pre><code>module.exports = {
  
      devtool: 'eval-cheap-module-source-map',
      mode: isDev ? 'development' : 'production',
      entry: {
          index: './src/index.js',
          login: './src/login.js',
          test:'./test.js'
      },
      output: {
          path: path.resolve(__dirname, 'dist'),
          filename: '[name].[chunkhash:6].js',
          publicPath: '/'
      },
      module: {
          rules: [
              {
                  test: /\.jsx?$/,
                  use: ['cache-loader','babel-loader'],
                  include: [path.resolve(__dirname, 'src')]
                  
              },
              {
                  test: /\.(sc|sa|c)ss/,
                  use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
                  include: [path.resolve(__dirname, 'src')]
          
              }
           ]
       }
    }
  </code></pre>
  <p>I have no idea, then add a <code>test.js</code> to put all the scss <code>import</code> in it and add it to the entry.But the output will also has a <code>test.xxxxxx.js</code> file in the <code>dist</code> folder and I do not want it though.</p>
  <p>So,what is the right way to meet my requirement.</p>
  <p>Is it possible to just compile all <code>scss</code> file without <code>import</code> in the entry <code>js</code> file and do not generate the same-name js file in output folder?</p>