Search code examples
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.