Is there a way to set prefix for all local images in next js using next.config.js?
Asked Answered
P

0

6

I have setup my next js code with some static images into the system which is used as

<Image
  height={50}
  width={140}
  alt="Alt"
  objectFit="contain"
  src="/images/logo.png"
/>

but now I have to deploy it with basePath: '/product. Urls are working fine but images are not loading and I need to use /product/images/logo.png before every src.

Is there a way to set in next.config.js and I don't have to change it for the every single image in the system?

Predestinate answered 17/8, 2021 at 12:37 Comment(3)
Most probably no. There is this assetPrefix thing but it also doesn't work with static files stored in the public directory. Related: stackoverflow.com/a/65113234. I don't think there is any feasible option other than find and replace. For future projects, try using the new static image imports instead. They will not require such things whenever basePath is changed.Refute
Thanks for the comment. I am not aware about new static image imports. Can you paste a link here for other users as well?Predestinate
nextjs.org/docs/basic-features/image-optimization#image-importsRefute

© 2022 - 2024 — McMap. All rights reserved.