url-loader

URL Loader

Loads files as `base64` encoded URL

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'
  }
}

Maintainers

Alexander Krasnoyarov

url-loader

URL Loader

URL Loader

URL Loader

Install

Usage

Options

`limit`

`mimetype`

`prefix`

Maintainers

Use this within your firewall

Collaborators list

Stats

Try it out

Keywords

Dependencies (2)

Dependents (1675)