url-loader
url-loader
Loads files as base64
encoded URL
Install
npm install --save-dev url-loader
Usage
The url-loader
works like the file-loader
, but can return a DataURL if the file is smaller than a byte limit-
import img from './image.png'
webpack.config.js
module.exports = { module: { rules: [ { test: /\.(png|jpg|gif)$/, use: [ { loader: 'url-loader', options: { limit: 8192 } } ] } ] } }
Options
Name | Type | Default | Description |
---|---|---|---|
limit |
{Number} |
undefined |
Byte limit to inline files as Data URL |
mimetype |
{String} |
extname |
Specify MIME type for the file (Otherwise it's inferred from the file extension) |
prefix |
{String} |
false |
Parameters for the file-loader are valid too- They are passed to the file-loader if used |
limit
If the file is greater than the limit (in bytes) the file-loader
is used and all query parameters are passed to it-
The limit can be specified via loader options and defaults to no limit-
webpack-config-js
{ loader: 'url-loader', options: { limit: 8192 } }
mimetype
Set the MIME type for the file. If unspecified the file extensions will be used to lookup the MIME type.
webpack.config.js
{ loader: 'url-loader', options: { mimetype: 'image/png' } }
prefix
{ loader: 'url-loader', options: { prefix: 'img' } }
© JS Foundation and other contributors
Licensed under the Creative Commons Attribution License 4.0.
https://webpack.js.org/loaders/url-loader