Install

1yarn add -D probe-image-size-loader

Usage

Can also be used with lqip-loader.

webpack.config.js

1module.exports = {
2  module: {
3    rules: [
4      {
5        test: /\.png$/,
6        use: ['probe-image-size-loader', 'file-loader']
7      }
8    ]
9  }
10};

Output

1module.exports = {
2  src: __dirname + 'some/path/to/image.png',
3  height: 100,
4  width: 200
5};

Usage in JS files

1import image from './image.png';
2
3const Image = () => (
4  <img src={image.src} height={image.height} width={image.width} />
5);

Example

$ cd example
$ yarn
$ yarn build
$ node dist/main.js

{
  src: 'cb12bc24511449db821768715e85b0d9.gif',
  height: 208,
  width: 220
}