Hello Frontity,
I’m trying to update Frontity to the latest version but i’m running into an issue.
On initial load, all the images that are imported into components are missing. After looking into it further, it looks like the srcs for the images are not being prepended with the public directory path.
However, when the page hot reloads or is rendered client side, the images appear with the correct path.
Below is a link to a very basic theme demonstrating the issue, but this can also be replicated in the Mars theme.
https://we.tl/t-FN4d21Y4vO
import image from '../static/test.png';
const Theme = () => <img src={image} alt="Not loading from server package." />
export default Theme;
Image src on initial load: images/test.png
Expected src (and rendered correctly client side): /static/images/test.png
Kind regards,
Jack
1 Like
Has anyone been able to replicate this issue?
Hi @jack.templeman.user1 , its a bug from the latest version of frontity.
I just reported it here:
Hi @luisherranz ,
I just update and like @koli14 , I notice that the assets import doesn’t work anymore.
I created a public repository only with a fresh install of the “mars theme” and one asset import:
I notice that the problem is on the SSR. On the server side rendering the path of the images is the relative path of the current url, so for example:
with the image /resources/imgs/logo.png
on a page that have this slug /about-page/
The link to the image on SSR is
/about-page/images/log…
and here:
opened 02:52PM - 03 Mar 22 UTC
**_Bug report_**
- I've updated both my project and my packages to the latest… Frontity versions: https://docs.frontity.org/guides/keep-frontity-updated
- I've searched for existing issues.
- I've checked the documentation: https://docs.frontity.org
- I've checked the community forum: https://community.frontity.org
**Expected behavior**
Import an static file like an image and load it directly on the code.
**Observed behavior**
The problem is on the SSR. On the server side rendering the path of the images is the relative path of the current url, so for example:
- If we have the image **/resources/imgs/logo.png**
- on a page that have this slug **/about-page/**
The link to the image on SSR is
- **/about-page/images/logo.png** instead of being **/static/images/logo.png**
**Steps involved to reproduce the problem**
1. Create or update a frontity installation with the latest update
2. Try to import any static file, like an image
```
import Logo from "../images/logo.png";
const Header = ({ state }) => {
return (
<>
<img src={Logo} />
</>
);
};
```
3. The image will not load if you refresh the page or access via SSR
Link to the repository: https://github.com/husseincak/testfrontity/
1 Like
Thanks for the update @Hussein . Glad its not just me!
Any updates on this issue?