Reduce cache churn by generating stable file names, manually hashing them, and providing a manifest by which to read the hashed assets. This is generally intended for importmaps, but could have other applications as well.
npm install asset-mapperReduce cache churn by generating stable file names, manually hashing them, and
providing a manifest by which to read the hashed assets. This is generally intended
for importmaps, but could have other applications as well.
For more info checkout this issue:
And this reading:
``bash
npm install asset-mapper
yarn install asset-mapper
pnpm install asset-mapper
`
`js
// vite.config.js
import { RollupAssetMapper } from "asset-mapper"
export default {
build: {
rollupOptions: {
input: {
// ...
},
output: {
entryFileNames: [name].js,chunks/[name].js
chunkFileNames: ,assets/[name].[ext]
assetFileNames:
}
outdir: // ...
},
},
plugins: [
RollupAssetMapper()
],
}
Right now there is a patch package in place to change from hashed files to unhashed files.
Perhaps theres a way to fix it with config, but I wanted to get a quick prototype.
`bash`
git clone https://github.com/konnorrogers/asset-mapper.git
pnpm run setup
cd tests/fixtures/svelte-kit
pnpm run build
Then go to: .svelte-kit/output/client/asset-mapper-manifest.json to see the built assets.
While this doesn't quite solve the "cache-invalidation" issue, its a step in the right direction.
The next step is to use the generated manifest to construct your own "importmap"
Example:
`html``