Loaders

webpack enables use of loaders to preprocess files. This allows you to bundle any static resource way beyond JavaScript. You can easily write your own loaders using Node.js.

Loaders are activated by using loadername! prefixes in require() statements, or are automatically applied via regex from your webpack configuration – see configuration.

Files

  • raw-loader Loads raw content of a file (utf-8)
  • val-loader Executes code as module and consider exports as JS code
  • url-loader Works like the file loader, but can return a data URL if the file is smaller than a limit
  • file-loader Emits the file into the output folder and returns the (relative) URL
  • ref-loader Create dependencies between any files manually

JSON

Transpiling

Templating

Styling

Linting && Testing

Frameworks

Awesome

For more third-party loaders, see the list from awesome-webpack.

© JS Foundation and other contributors
Licensed under the Creative Commons Attribution License 4.0.
https://v4.webpack.js.org/loaders/