In working to enable CloudFront Distribution and SSL for the site, I found that the styling was not consistent between the homepage and the post pages. Most glaringly, example code blocks were rendering dark text on a dark background.
After some digging around, I found that a CSS file was not being linked on the homepage. This was easily fixed locally and uploaded to the bucket. Alas, the very nature of a content delivery network is that updates to files can take a very long time to show up on clients - or never at all, if the right conditions are not met. To force the update, I had to find out which files were updated and invalidate the CloudFront cache for them. Looking back at the update, I found that these were the updated files:
1
2
3
4
5
6
7
8
9
[info] Deploying content/_site/* to j.eremy.nl
[succ] Updated sw.js (application/javascript)
[succ] Updated sitemap.xml (application/xml)
[succ] Updated feed.xml (text/html; charset=utf-8)
[succ] Updated tabs/about.html (text/html; charset=utf-8)
[succ] Updated tabs/archives.html (text/html; charset=utf-8)
[succ] Updated assets/css/home.css (text/css; charset=utf-8)
[succ] Updated assets/css/home.css.map (text/plain; charset=utf-8)
[info] Summary: Updated 7 files. Transferred 215.0 kB, 154.0 kB/s.
Invalidating these paths updated the styling and now codeblocks are legible on the main page.
Ultimately, I added this to my Makefile:
1
2
3
4
invalidate:
AWS_PAGER="" aws cloudfront create-invalidation \
--distribution-id E1B35UBTOYE07S \
--paths '/*' --output yaml
and added invalidate to the all target.