How can hugo copy static directory to `public/static` instead of `public`?

support
1

I’m using vscode to write markdown post and using vscode markdown preview feature to preview.

When I add a picture to markdown, with the format ![some-pic](/static/img/some-pic.png) , the preview can show the picture but hugo generated html can’t, because hugo will copy the static directory to public rather than public/staitc .

But with the format ![some-pic](/img/some-pic.png) , hugo generated html is ok but vscode preview is not work for the picture.

So how can I adjust hugo configuration or vscode configuration to solve this problem?

https://stackoverflow.com/questions/60541084/how-can-hugo-copy-static-directory-to-public-static-instead-of-public

2

There is no setting that defines where Hugo will copy the static directory. I would expect VSCode to have some kind of path mapping or extension that does the mapping - but could not find anything.

I would “hack” my way around. Put your static files not in the static directory. Put them into the-files directory. (I am using this just for posterity, because assets is used otherwise in Hugo. You will find a name suitable to your project.) Then in your build script run hugo, then run cp the-files public/ and it should work as expected. VSCode is happy. Your website is happy.

PS: To make it clear: I think it’s the job of a setting or extension in VSCode to map these paths. Hugo can’t accommodate this need.

3

Should we make a issue for hugo?

4

Would something like this work with Hugo Modules?

# config.toml
...
[module]

  [[module.mounts]]
    source = "static"
    target = "static/static"
...
1 Like
5

To be perfectly honest I think this is not an issue on Hugo’s side. It might be easier to mount/map paths in VSCode. Have a look at page bundles for a way that is Hugo-compatible and should work on VSCode.

I don’t know enough about modules to answer that, but wouldn’t that lead to a loop in the end? like /static/image.jpg is the same as /static/static/image.jpg is the same as /static/static/static/image.jpg and so on…

Page bundles are probably the best way to move forward.

6

I’m not entirely sure, but I think that the files in static would be copied to public/static/ at build time. I assume that the vscode extension is pointing to the source code (before it’s processed by modules), so it would still point to static/image.jpg.

7

Hugo has settings for just about everything.

I’m not sure why you’d want this but:

[module]
[[module.mounts]]
source = "content"
target = "content"
[[module.mounts]]
source = "layouts"
target = "layouts"
[[module.mounts]]
source = "static"
target = "static/static"
2 Likes
8

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.