Cache-busting in Eleventy: a simpler way with Sass

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • WorkOS - The modern identity platform for B2B SaaS
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • eleventy-sass

    Yet another Sass/SCSS plugin for Eleventy. Source maps, PostCSS and revision hashes are supported.

  • It comes in the form of two recently introduced Eleventy plugins by Kentaro Imai: eleventy-sass and eleventy-plugin-rev. The former provides Sass-to-CSS compilation, and the latter adds filters you can access to provide versioning-based filename changes for cache-busting.

  • eleventy-plugin-rev

  • It comes in the form of two recently introduced Eleventy plugins by Kentaro Imai: eleventy-sass and eleventy-plugin-rev. The former provides Sass-to-CSS compilation, and the latter adds filters you can access to provide versioning-based filename changes for cache-busting.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • Sass

    Sass makes CSS fun!

  • If you use the Eleventy static site generator (SSG) and Sass to build your website, read on for some cool stuff.

  • Hugo

    The world’s fastest framework for building websites.

  • Back in late 2020, I wrote three posts about how to perform “cache-busting” on an Eleventy site’s CSS, which ensures the vast majority of web browsers will reliably show your most up-to-date styling. In the end, I suggested a method that accomplished this through a combination of package.json scripting and build-time JavaScript runs. It worked, but it was somewhat of a time drag during dev mode. Besides, it’s a lot clunkier than how one can do it in Hugo via that SSG’s built-in asset pipeline, Hugo Pipes. Thus, I’ve continued to look for a better way.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts