cache busting

[astral aurora]

Does Astro support hard cache busting in js/css generated files?

[cursive oxide]

Hi @astral aurora. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

Yes, Astro does support hard cache busting in JavaScript and CSS generated files. You can customize the output filenames of your assets using entryFileNames, chunkFileNames, and assetFileNames in a vite.build.rollupOptions entry in your astro.config.* file. This can be particularly useful for cache busting as you can include a unique hash in your filenames.

Here is an example of how you can configure this in your astro.config.mjs file:

import { defineConfig } from 'astro/config'
export default defineConfig({ 
  vite: { 
    build: { 
      rollupOptions: { 
        output: { 
          entryFileNames: 'entry.[hash].js', 
          chunkFileNames: 'chunks/chunk.[hash].js', 
          assetFileNames: 'assets/asset.[hash][extname]', 
        }, 
      }, 
    }, 
  }, 
})

In this configuration, [hash] is a placeholder for a unique hash that will be generated for each file. This ensures that each file has a unique name, which is a common technique for cache busting.

For more information, you can refer to the Astro documentation on configuring Astro (https://docs.astro.build/en/guides/configuring-astro/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@astral aurora kapa.ai is still learning and improving, please let us know how it did by reacting below

[molten sigil]

@astral aurora did you find a good solution for this? I am looking for a more efficient way to do cache invalidation in Cloudfront.