Eleventy: set global permalink format

Created on 20 May 2020  Â·  2Comments  Â·  Source: 11ty/eleventy

Trying to set a global permalink format (mainly to NOT create files as path-to/index.html because I'm trying to use 11ty to create html emails and need the file names.)

I'm trying _data/permalink.js

module.exports = '{{slug}}.html';

to set the global data field for this but it doesn't translate the usual {{slug}}.html and I don't know of any args being passed to JS data files.

This results in

Output conflict: multiple input files are writing to `dist/{{slug}}.html`. Use distinct `permalink` values to resolve this conflict.
  1. ./src/emails/febs.md
  2. ./src/emails/febs copy.md

`DuplicatePermalinkOutputError` was thrown:
    (Repeated output has been truncated…)
        at TemplateMap.checkForDuplicatePermalinks (/Users/zpykosz/Sites/11ty-emails/node_modules/@11ty/eleventy/src/TemplateMap.js:533:13)
        at TemplateMap.cache (/Users/zpykosz/Sites/11ty-emails/node_modules/@11ty/eleventy/src/TemplateMap.js:306:10)
        at async TemplateWriter._createTemplateMap (/Users/zpykosz/Sites/11ty-emails/node_modules/@11ty/eleventy/src/TemplateWriter.js:133:5)
        at async TemplateWriter.write (/Users/zpykosz/Sites/11ty-emails/node_modules/@11ty/eleventy/src/TemplateWriter.js:168:5)
        at async Eleventy.write (/Users/zpykosz/Sites/11ty-emails/node_modules/@11ty/eleventy/src/Eleventy.js:659:13)
Wrote 0 files in 0.11 seconds (v0.10.0)

Setting emails/emails.json doesn't work either.
.json { "permalink": "{{slug}}.html" }

Same error. It doesn't translate the slug into real file name.

As far as I can tell there's no config setting for globally setting the permalinks either.

What's the ideal config for doing this?

education

Most helpful comment

Thanks! That mostly worked. I just needed this for exactly what I wanted (in case others find it useful)

module.exports = {
  permalink: (data) => {
    return data.page.filePathStem + '.html';
  }
};

All 2 comments

Global data files don't get access to page data like that. Also JS data files don't support templating permalinks in a string (I think) since permalinks use whatever templating engine the file uses (JS doesn't have one: you have to use functions for dynamic permalinks).

The new Computed Data feature allows you to do what you're looking for. You can create a global _data/eleventyComputed.js that _will_ have access to template data. You can then use a JS function to return dynamic permalink:

// _data/eleventyComputed.js

module.exports = {
  permalink: data => data.slug + ".html"
}

Thanks! That mostly worked. I just needed this for exactly what I wanted (in case others find it useful)

module.exports = {
  permalink: (data) => {
    return data.page.filePathStem + '.html';
  }
};
Was this page helpful?
0 / 5 - 0 ratings