https://github.com/hipstersmoothie/probe-image-size-loader

Uses probe-image-size to inject the height and width into image imports.
https://github.com/hipstersmoothie/probe-image-size-loader

Last synced: 2 months ago
JSON representation

Uses probe-image-size to inject the height and width into image imports.

• Host: GitHub
• URL: https://github.com/hipstersmoothie/probe-image-size-loader
• Owner: hipstersmoothie
• License: apache-2.0
• Created: 2018-06-19T21:05:51.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2018-07-11T17:25:38.000Z (almost 7 years ago)
• Last Synced: 2024-10-29T08:43:35.576Z (6 months ago)
• Language: JavaScript
• Size: 738 KB
• Stars: 2
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
[![CircleCI](https://img.shields.io/circleci/project/github/hipstersmoothie/probe-image-size-loader.svg?style=for-the-badge)](https://circleci.com/gh/hipstersmoothie/probe-image-size-loader)

[![Codecov branch](https://img.shields.io/codecov/c/github/hipstersmoothie/probe-image-size-loader/master.svg?style=for-the-badge)](https://github.com/hipstersmoothie/probe-image-size-loader)

[![npm](https://img.shields.io/npm/v/probe-image-size-loader.svg?style=for-the-badge)](https://www.npmjs.com/package/probe-image-size-loader)

[![npm](https://img.shields.io/npm/dt/probe-image-size-loader.svg?style=for-the-badge)](https://www.npmjs.com/package/probe-image-size-loader)



  

    

  

  
Probe-Image-Size Loader

  
Uses probe-image-size to inject the height and width into image imports.



## Install

```bash

yarn add -D probe-image-size-loader

```

## Usage

Can also be used with [lqip-loader](https://github.com/zouhir/lqip-loader).

**webpack.config.js**

```javascript

module.exports = {

  module: {

    rules: [

      {

        test: /\.png$/,

        use: ['probe-image-size-loader', 'file-loader']

      }

    ]

  }

};

```

**Output**

```javascript

module.exports = {

  src: __dirname + 'some/path/to/image.png',

  height: 100,

  width: 200

};

```

**Usage in JS files**

```javascript

import image from './image.png';

const Image = () => (

  

);

```

### Example

```

$ cd example

$ yarn

$ yarn build

$ node dist/main.js

{

  src: 'cb12bc24511449db821768715e85b0d9.gif',

  height: 208,

  width: 220

}

```