Uploaded images aren't published with pages

I just enabled the Visual Editor on my site, and I’m having an issue with images uploaded for a page using an image field. I’m using Hugo as my ssg.

I’m using the GitContentSource and my config successfully lets me make new pages and upload images to the expected repo location on the preview branch. The uploaded image also previews correctly in the visual editor.

However, when I publish the page, only the page’s markdown file gets merged into the main branch. This ultimately leads to a file not found issue when the deploy completes.

My assets configuration looks like this:

assetsConfig: {
  referenceType: "static",
  staticDir: "static",
  uploadDir: "images/uploads",
  publicPath: "/"
}

I expect that:

  • images get uploaded to static/images/uploads/
  • the public path on deploy resolves to /images/uploads/

All of this happens as expected in the preview branch. If I manually merge the image from preview into main, the deployed site works as expected.

My site is https://swayzee-edc.netlify.app, but the repo for it is currently private.

SavvyBot seems to think that this question without any replies has been answered but not marked at such. Let me disabuse it. This has not been answered.

Apologies for the wait here! You state when you publish the page, you’re seeing a file not found issue on the final deploy. Could you point me to a link to a deploy where you’re seeing that behavior? Additionally, where on the site are you seeing this error?

Hi. I have a section of my site labeled News which is a page type in both the Hugo and Stackbit sense of the term. In the Visual Editor, my pages are configured with the following fields:

"contentSources": [
        new GitContentSource({
          rootPath: __dirname,
          contentDirs: ["content"],
          models: [
            {
              type: "page",
              name: "news",
              label: "Post",
              urlPath: "/{slug}",
              filePath: "content/news/{slug}.md",
              fields: [
                  { name: "title", type: "string", required: true },
                  { name: "description", type: "string" },
                  { name: "author", type: "string", default: "Author" },
                  { label: "Publish Date", name: "date", type: "datetime" },
                  { name: "tags", type: "list", items: { "type": "string" }},
                  { label: "Featured Image", name: "image", type: "image", required: false }
              ]
            }
          ],
          assetsConfig: {
            referenceType: "static",
            staticDir: "static",
            uploadDir: "images/uploads",
            publicPath: "/"
          }
        })
    ]

The Visual Editor DOES let me select a Featured Image and it DOES upload and commit the image to the Visual Editor’s preview branch. However, when I Publish the post inside the Visual Editor, only the page’s text content is committed to the deploy branch (main in my case), and the image is NOT committed to the deploy branch. This produces the File Not Found issue on the deploy simply because Hugo can’t find the source file in the deploy branch.

I’m not sure it helps much, but I’ve made a post which demonstrates the issue here. To me, it seems like I’m either missing something obscure in my stackbit configuration or there’s a bug in the Visual Editor’s publishing automation.

Thanks for providing that additional information. We have identified this as a bug and it’s been escalated to our dev team. Stay tuned for updates!

1 Like

Just curious if there’s any update on this, or whether there’s a publicly available bug tracker I can follow. Thanks!

This is being tracked internally, though there’s no useful update at present.

@csparker247 Thanks for your patience here, this has been resolved. You’ll need to ensure you restart your container to see those changes take effect.

Confirmed that this works for me now. Thanks!

1 Like