Support passing information to JavaScript data files

[cfjedimaster]

Is your feature request related to a problem? Please describe.
My initial need was to build a "stats page" for an 11ty site. By that I mean, the total # of posts, information about category/tag usage, first post, last post, etc. I could have used a Liquid template to generate this data, but instead I wanted to use a JS data file so I could simply work with the generated data in a template.

Because my blog posts use tags to describe content, and not to define them as "posts", I had used my 11ty config to add a custom collection called posts based on the folder where I kept them.

My thinking was to use this collection in my JS data file, but it looks like we don't have access to them. So one ask would be to perhaps document that. My guess is that the JS data files bootstrap at the same time as the site itself, but I kinda thought they might be run after the config is setup. Maybe we can ensure that somehow? Or maybe it IS done later, but we simply don't have access to it.

So I guess my ask is - can we get access to everything templates have? I'd expect this to come in via arguments passed to my JS function.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe alternatives you've considered
In my case, I just ended up using EJS. I don't like using it for my templates, but for this complex data need - it worked well.

[jevets]

Sounds like you're hoping to access data.collections from within a JS template file (.11ty.js).

In a class-based .11ty.js data file, I think it's available in the render() method but not the data() method:

// some-template.11ty.js

module.exports = class {
  data() {
    // not available here
  }
  render(data) {
    // it is available here
    // and you can mutate it before `return`ing rendered stuff

    console.log(data.collections)
    data.superCustomNewKey = 'wow amazings'
    return // ...
  }
}

It may be available to an exported function module.exports = function (data) {...} but I'm not sure.

Seems like there was another issue posted recently about modifying data before rendering a template, but I can't find it right now. #723

[jevets]

Related #642

[cfjedimaster]

Um... am I crazy or is data/render not documented anywhere? I don't see it here - https://www.11ty.dev/docs/data-js/. How is this featured used?

[jevets]

Sounds like you're hoping to access data.collections from within a JS template file (.11ty.js).

Aw man, I'm the crazy one, sorry. I was thinking JavaScript template files (11ty.js).

[cfjedimaster]

No worries - thank you for trying to help!

[fredrikekelund]

This should probably be possible in v0.11 thanks to the new eleventyComputed feature. Docs are here.

[cfjedimaster]

Well it was possible before by workarounds. This does not feel like a solution to the original ask though. I want to use this data in my data file, before a template even tries to use it. My intent here to have less logic in my template if that makes sense.

[zachleat]

Hey sorry to check in super late here, is this still relevant?

My thinking was to use this collection in my JS data file, but it looks like we don't have access to them.

What does this mean? Collections should be available inside of eleventyComputed (no matter where you set it). I do want to also make sure you’ve seen the Order of Operations docs page https://www.11ty.dev/docs/advanced-order/

[cfjedimaster]

So imaging _data/stats.js, in there, I'd want to have access to collections. Looking at the order of operations, it's a bit hard to tell if .eleventy.js would run before _data stuff. I had assumed it would, and if I had foo defined as a collection, then anything in _data could work with it (if provided access to it).

[zachleat]

In 1.0 we did add arguments to global data files, see https://www.11ty.dev/docs/data-js/#arguments-to-global-data-files

[zachleat]

#1933 was the issue for it

[cfjedimaster]

Sorry for the late reply to this - but would that data include collections? It looks like it doesn't.