KosmosisDire / obsidian-webpage-export

Export html from single files, canvas pages, or whole vaults. Direct access to the exported HTML files allows you to publish your digital garden anywhere. Focuses on flexibility, features, and style parity.
https://docs.obsidianweb.net/
MIT License
879 stars 75 forks source link

[Bug] [1.8.01]: Exported/Exporting Images Doesn't Work #486

Open DEATHB4DEFEAT opened 3 months ago

DEATHB4DEFEAT commented 3 months ago

What happened?

(Click the texts to see images)

Seems related to #448

What Happened

I tried to add images to a document, but they wouldn't load. (I tried without the plugin that's making them into a grid too)

![image](https://github.com/user-attachments/assets/7ebf202a-4674-48b1-a91f-05b890e7bb81)

I tried viewing the image itself, that also didn't load

![image](https://github.com/user-attachments/assets/050b3855-271c-47a5-a22d-4c9c535c48a2)

I tried reloading the image after editing something and the website got messed up

![image](https://github.com/user-attachments/assets/9b9990cf-fa58-48b8-88c3-065555f97ff2)

The export directory doesn't have the Media folder, but the website does

![image](https://github.com/user-attachments/assets/4f03727a-01dd-4b73-9b29-94c13d193168) ![image](https://github.com/user-attachments/assets/925f8079-dd33-4620-8287-d146c0b4ffaa)

What I expected to happen

The document with images should look like this

![image](https://github.com/user-attachments/assets/d90df5b7-ba2d-46ac-a141-f08c202d8974)

I should be able to view the image on its' own

![image](https://github.com/user-attachments/assets/38856c56-d3f5-4134-8814-91d3d8eecf90)

Reproduction

  1. Set up a vault with this plugin
  2. Add an image in a folder
  3. Add a document with a link to the image
  4. Export to Online Web Server
  5. View exported document or the image online
  6. Image doesn't load
  7. Check export directory
  8. Image file/folder isn't there

Last Working Version

No response

Version

1.8.01 and 1.8.1-2b

Operating System

Linux (NixOS)

Obsidian Version

v1.6.7

Which browsers can you reproduce this in?

Firefox, Chrome

Relevant log output

N/A

Additional Info

My repository is here in case that might be helpful: https://github.com/DEATHB4DEFEAT/Obsidian-SS14-Character-Relations

KosmosisDire commented 3 months ago

Thanks, I am not sure what is happening here. Could you try to reproduce this in a sandbox vault with only one image and one note with all settings at default and no other plugins?

Then can you include the log output from during the export (ctrl + shift + i) so I can see if there are any errors?

KosmosisDire commented 3 months ago

I also notice that the styles on your site are a little messed up. This is because of #455. I will be releasing an update soon to fix this

DEATHB4DEFEAT commented 3 months ago

I tested with a new vault and am getting slightly different results, though it's not working still

Images

## Obsidian ![image](https://github.com/user-attachments/assets/42dd8244-eccc-4b6d-8ded-c9a507aa6d40) ## Website ![image](https://github.com/user-attachments/assets/51e61ee4-2899-44f5-9aa4-f1919bd7fe3a) ![image](https://github.com/user-attachments/assets/5e11180f-bf5c-493e-b698-4a5cf86b9c00) ## File Explorer ![image](https://github.com/user-attachments/assets/df95f7fd-32e4-465c-b4cc-c8aa783a2f23)

DEATHB4DEFEAT commented 3 months ago
Oh, weird, I just re-exported my original vault after that test (I deleted everything in the export directory) and now the images are working, though styles are wrong.

![image](https://github.com/user-attachments/assets/3cdeaf42-13cd-49ff-a359-ea6ef14f79ed)

KosmosisDire commented 3 months ago

Hey, I just released a beta version that should address this. If you could try it out and let me know if his issue is fixed and if you find any other issues. There are instructions for installing the beta in the readme :) Thanks!

saerich commented 2 months ago

Tested the beta version this morning, received [ERROR] Problem initializing document: Index.md. TypeError: tags.forEach is not a function

It's worth noting there is a tag on the index page, and only one tag: "Home".

Removing the tag however DID fix the build, and showed the obsidian elements are now rendering correctly!

Additionally, the "Backlinks" section appears to duplicate itself when navigated in the tree view; I'm using the webserver based rendering approach for reference.

KosmosisDire commented 2 months ago

Thanks for testing it! I am glad everything is showing up correctly.

I am not able to reproduce the errors you mentioned.

It's worth noting there is a tag on the index page, and only one tag: "Home".

Was this tag defined in the frontmatter or inline on the page?

Do the backlinks duplicate if you navigate using links or graph view? Or only when in the tree. Also were any errors logged in the console on the website itself when the backlinks duplicate.

DEATHB4DEFEAT commented 2 months ago

Sorry for the large delay. I've tried the latest beta and seem to not have this issue anymore, though there are several other issues I noticed;

Settings no longer lets me set a site URL and the output log complains about it for RSS (scroll this block when expanded, there's multiple images)

![image](https://github.com/user-attachments/assets/ea6784d0-d007-4597-809e-822674f466ce) ![image](https://github.com/user-attachments/assets/acc72dad-31eb-4cde-a632-02331ab3a59b)

I can't click my images from the image-gallery plugin any more, though they and normal images *display* fine

![image](https://github.com/user-attachments/assets/215d0431-1349-49c6-9264-170a165cbc0f)

The graph view can't be clicked and can't pan around

Queries from clicking a tag take me to Nginx's home/root page (which I set to home.html) and don't do anything else

Searching seems to not work at all

Selected pages are pretty much unreadable

![image](https://github.com/user-attachments/assets/26983d87-b375-462a-bd0a-c872f9cffbbe)

Tags should be titled, like backlinks are

Multiple tags don't have space between them

Tags and backlinks should probably be in a colored box or separated somehow, it took me a bit to realize where and what they were

I don't seem to be getting the issues saerich was, you probably fixed them in this time.

KosmosisDire commented 2 months ago

@DEATHB4DEFEAT

Thanks for the details! I will look into these bugs.

DEATHB4DEFEAT commented 2 months ago

What do you want to happen when you click your images?

The linked plugin usually (and did before the beta iirc) expands the images in a carousel modal (I think that's what it's called) when clicked

Could you give me the console outbut in your browser after trying to do the search and graph view? I am not able to reproduce these issues.

It's no longer sending me home, but this is what the console says:

image

"Selected pages are pretty much unreadable" - this is probably caused by your theme. My suggestion would be to override this using a custom snippet. You can let me know which theme you use and I can look into it. (assuming it is fixed by switching your theme)

I use the Catppuccin mocha theme

You can add a title to tags if you want in the settings.

Oh, cool, I missed that.

Backlinks should be seperated into their own box already. What does it look like for you? I will think about tags

image

KosmosisDire commented 2 months ago

@DEATHB4DEFEAT

The linked plugin usually (and did before the beta iirc) expands the images in a carousel modal

It is unlikely it opened in a carousel. If you just mean that it made it larger in a static way, that is possible through CSS. Have you tried enabling the CSS for the Image Gallery plugin in the settings?

It's no longer sending me home, but this is what the console says:

For the console output I actually meant can you try to do a search in the search bar, as well as try to drag and click on the graph view. I want to see if any errors are being thrown that could be releated to these two problems

Backlinks image

I guess I removed the box around the backlinks and forgot about it. I can add it back haha

DEATHB4DEFEAT commented 2 months ago

Have you tried enabling the CSS for the Image Gallery plugin in the settings?

Yeah, didn't seem to do anything, can try again later in case I cached an old version on accident and will confirm if it worked before.

For the console output I actually meant can you try to do a search in the search bar, as well as try to drag and click on the graph view. I want to see if any errors are being thrown that could be releated to these two problems

I get this when the page loads:

image

And this when hovering over the graph for the first time:

image

No other errors when interacting with things.