"ENOENT: no such file or directory" error if cache key has a slash in it

[pdehaan]

I was trying to cache some semi-expensive network calls to npm APIs and noticed I get errors if I set the cache key to something with a "/" in it (like a scoped package name). It looks like eleventy-cache-assets/AssetCache is treating the backslash as a file path delimiter when saving the file, which them blows up since there presumably isn't an ".cache/eleventy-cache-assets-@11ty/" folder.

// src/_data/test.js
const { AssetCache } = require("@11ty/eleventy-cache-assets");

module.exports = async function() {
  // This seems to be the issue here (the "/" specifically).
  const asset = new AssetCache("@11ty/eleventy");
  if (asset.isCacheValid("1h")) {
    return asset.getCachedValue();
  }

  const value = "Johnny Cache";

  await asset.save(value, "json");
  return value;
};

OUTPUT

 npm run build

> [email protected] build /private/tmp/11ty-cache-asset-slug
> eleventy

> ENOENT: no such file or directory, open '/private/tmp/11ty-cache-asset-slug/.cache/eleventy-cache-assets-@11ty/eleventy.json'

`Error` was thrown:
    Error: ENOENT: no such file or directory, open '/private/tmp/11ty-cache-asset-slug/.cache/eleventy-cache-assets-@11ty/eleventy.json'
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `eleventy`
npm ERR! Exit status 1

Workaround

I had to slugify the key name:

-  const asset = new AssetCache("@11ty/eleventy");
+  const slugFn = require("@11ty/eleventy/src/Filters/Slug");
+  const name = slugFn("@11ty/eleventy");
+  const asset = new AssetCache(name);

Now eleventy-cache-assets will save the filename as "./.cache/[email protected]" instead of "./.cache/eleventy-cache-assets-@11ty/eleventy.json"

[zachleat]

Asset filenames will now be hashed instead of using raw key values! Shipping with 3.0.0