How to set imagesPublicPath in runtime

[theallseingeye]

Currently I can use

app.setAssetPrefix('http://cdn.com/myapp')

to set the assetPrefix for next.js files in runtime, that way I can reuse my build file for both staging and production environment

Is it possible to set imagesPublicPath in runtime too?

[cyrilwanner]

Hi @theallseingeye

This is unfortunately not possible out of the box with the current version. But the next major version of this plugin (which I'm currently working on) will use the same asset prefix as next does, so this will work in the future.

Until then, you can achieve the same with a bit more manual setup if you want to.

You could create a new file (e.g. images-prefix.js) which stores and exports the prefix in a variable and exposes a function to set this variable.
Then, everywhere you use an image, you can prefix the src with this variable, e.g.
<img src={imagesPrefix + require('./image.png')}>. Of course, you could also create a wrapper component which adds this prefix automatically for every image.

[avaleriani]

hey @cyrilwanner has this been fixed? I'm trying canary.10 but it looks like it's not working when using the or component. Also src property type does not allow to concatenate the prefix.