Search code examples
javascriptrequirejsamd

How to use retina.js with require.js?

Is there a way to use retina.js v2.0 as AMD module for require.js?

I have tried to do it like this:

main.js file:

paths: {
  retina: 'path/to/retina'
}
shim: {
   retina : {
     exports: "retina"
   }
}

requirejs(['retina']);

HTML file - regular image tag with source to low-res image. Retina.js is loaded through require.js, but image is not swapped for @2x image. This solution doesn't work.

Attempt 2 - try it without shim - it doesn't work.

Attempt 3 - add data-rjs="path/to/image@2x.png" to image tag - it doesn't work

Am I doing something wrong?

Solution

  • After some digging, I have found an answer

    Shim must be defined this way:

    shim: {
  "retina" : {
    exports: "retinajs"
  }
}

    When you require this script, you must do it this way:

    requirejs(['retina'], function(retina) {
  retina();          
});

    This works only on images that have data-rjs attribute defined.

    <img src="image.png" data-rjs="image@2x.png" />