Nuanced Pumpkin Mavens

    reimgix
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.2 • Public • Published

    reimgix

    npm npm GitHub issues GitHub stars Twitter

    🌇 React utils to imgix™

    Usage

    Generate a stringified url with params

    import { generate } from 'reimigx'
     
    const url = generate('http://your.site/img.png?fit=clamp', { h: 50 })
    // url = http://your.site/img.png?fit=clamp&h=50
    const url = generate(
      'http://your.site/img.png?fit=clamp',
      { h: 50 },
      { removeUrlParams: true } // will remove fit=clamp
    )
    // url = http://your.site/img.png?h=50

    Lqip techinique

    import { Lqip, generate } from 'reimigx'
     
    const url = generate('http://your.site/bear.png?fit=clamp', { h: 50 })
     
    const App = () => (
      <Lqip src={url}>
        {({ src }) => (
          <img src={src} alt="Bear" />
        )}
      </Lqip>
    )
    import { Lqip, generate } from 'reimigx'
     
    const url = generate('http://your.site/bear.png?fit=clamp', { h: 50 })
     
    const App = () => (
      <Lqip src={url}>
        {({ src, loaded }) => (
          <div>
            Image below is using {loaded ? 'full version' : 'lqip version'}
            <img src={src} alt="Bear" />
          </div>
        )}
      </Lqip>
    )

    Install

    Node Module

    yarn add reimgix
    
    # or
    
    npm i reimgix
    

    UMD library

    <script src="https://unpkg.com/reimgix/dist/reimgix.min.js"></script>

    exposed as Reimgix

    Contribute

    You can help improving this project by sending PRs and helping with issues.

    Install

    npm i reimgix

    DownloadsWeekly Downloads

    0

    Version

    1.0.2

    License

    MIT

    Unpacked Size

    69.7 kB

    Total Files

    18

    Last publish

    Collaborators

    • pedronauck
    • renatorib