Giters

swanky-docs / swanky

The core engine for the Swanky Docs ecosystem.

Home Page:https://swanky-docs.github.io/swanky-docs.org/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Where do images go?

nloui opened this issue · comments

commented

Hi! I think this package is awesome. Thanks for making it. I'm trying to figure out where to start and how to best reference images?

commented

@nloui - did you find the solution? If so, would you mind briefly documenting it in this issue? Other people may find it helpful. Thanks!

commented

Yes, totally!

Assuming your file structure is:
/content/page1/overview.md
/content/page1/assets/image.png

This is the file path I used:
(../../../../content/page1/assets/image.png)

commented

thanks @nloui. You have highlighted something that needs to be documented as navigating the image path as you have commented is less than ideal. As an alternative swanky has been configured to resolve images from an assets folder inside your src directory e.g.

<my-root-swanky-directory>/<my-src-directory>/assets

This will allow you to resolve images in your content files by using the ~ character which will let webpack know you need to resolve this path from an alias. So in your case:

<img src="../../../../content/page1/assets/image.png" />

becomes:

<img src="~assets/image.png" />

Hope this helps and I will keep this issue open until I have updated the docs.