Rules vs Loaders in Webpack - What's the Difference?

Question

In some Webpack examples, you see reference to a \"rules\" array:

module.exports = {
  module: {
    rules: [
      {
        test: /\\.scss$/,
        use:          


        

Answer 1

Loaders is used in Webpack 1, and Rules in Webpack 2. They say that "Loaders" in the future it will be deprecated in favour of module.rules.

See Migrating Versions at the official Webpack site.

module.loaders is now module.rules

The old loader configuration was superseded by a more powerful rules system, which allows configuration of loaders and more. For compatibility reasons, the old module.loaders syntax is still valid and the old names are parsed. The new naming conventions are easier to understand and are a good reason to upgrade the configuration to using module.rules.