Can't import directly from absolute static path.

[tropical32]

In my app I pass routes to image files to have them displayed in many different components. How can I get next-optimized-routes to work with absolute routes? The documentation mentions only a relative import: ./images/img.jpg.

This is an import that works fine with regular next.js:

<img src="/static/img/logo.png" />

next-optimized-images route that also works:

<img src={require("../../static/img/logo.png")} />

next-optomized-images that doesn't work but should:

<img src={require("/static/img/logo.png")} />

Error message:

./src/components/Component1.js
Module not found: Can't resolve '/static/img/logo.png' in '/Users/???/Projects/react-projects/???/???/src/components'

[tropical32]

It's not an issue of this library after all. It's a webpack/babel configuration. See: vercel/next.js#946 (comment)

[cyrilwanner]

Hey @dydokamil. Yes, this is not directly related to this plugin but as it is based on webpack, you can configure webpack to understand absolute paths. I also do it in my project for such things, even for global components (here is a nice example: https://github.com/zeit/next.js/tree/master/examples/with-absolute-imports, the related config can be seen in next.config.js). Your link shows a similar config in the .babelrc file. I usually configured it in webpack, but it looks like it works fine in babel as well.

I'll close the issue as it is more related to webpack in general, but feel free to reopen it if you are experiencing problems with the implementation. I'm happy to help :)