11ty

Eleventy Documentation

This documentation is for an older version. Go to the newest Eleventy docs or check out the full release history.

Documentation Pages

JavaScript Data Files

This file applies to both Global Data Files (*.js inside of your _data directory) and Template and Directory Data Files (*.11tydata.js files that are paired with a template file).

You can export data from a JavaScript file to add data, too. This allows you to execute arbitrary code to fetch data at build time.

module.exports = [
"user1",
"user2"
];

If you return a function, we’ll use the return value from that function.

module.exports = function() {
return [
"user1",
"user2"
];
};

We use await on the return value, so you can return a promise and/or use an async function too. Fetch your data asynchronously at build time!

module.exports = function() {
return new Promise((resolve, reject) => {
resolve([
"user1",
"user2"
]);
});
};
async function fetchUserData(username) {
// do some async things
return username;
}
module.exports = async function() {
let user1 = await fetchUserData("user1");
let user2 = await fetchUserData("user2");
return [user1, user2];
};

Example: Using GraphQL

This "Hello World" GraphQL example works out of the box with Eleventy:

var { graphql, buildSchema } = require("graphql");
// this could also be `async function`
module.exports = function() {
// if you want to `await` for other things here, use `async function`
var schema = buildSchema(`type Query {
hello: String
}`);
var root = {
hello: () => "Hello world async!"
};
return graphql(schema, "{ hello }", root);
};