diff --git a/src/content/concepts/loaders.md b/src/content/concepts/loaders.md index 96f464250d6e..b3aa5a74f813 100644 --- a/src/content/concepts/loaders.md +++ b/src/content/concepts/loaders.md @@ -52,7 +52,9 @@ There are three ways to use loaders in your application: ### Configuration [`module.rules`](/configuration/module/#module-rules) allows you to specify several loaders within your webpack configuration. -This is a concise way to display loaders, and helps to maintain clean code. It also offers you a full overview of each respective loader: +This is a concise way to display loaders, and helps to maintain clean code. It also offers you a full overview of each respective loader. + +Loaders are evaluated/executed from right to left. In the example below execution starts with sass-loader, continues with css-loader and finally ends with style-loader. See ["Loader Features"](/concepts/loaders/#loader-features) for more information about loaders order. ```js-with-links-with-details module.exports = { @@ -67,7 +69,8 @@ module.exports = { options: { modules: true } - } + }, + { loader: ['sass-loader'](/loaders/sass-loader) } ] } ]