javascriptwebpackurlloaderwebpack-file-loader

Url-loader vs File-loader Webpack

I'm trying to figure out the difference between url-loader vs file-loader. What does DataURl mean?

The url-loader works like the file-loader, but can return a DataURL if the file is smaller than a byte limit.

Solution

  • url-loader will encode files to base64 and include them inline rather than having them loaded as separate files with another request.

    A base64 encoded file may look something like this:

    data:;base64,aW1wb3J0IFJlYWN0IGZ...

    This would be added into your bundle.