Add a draft mode

[Peter Bowyer]

Is your feature request related to a problem? Please describe.
Say I've got 10-15 drafts. I want them rendered locally but I don't want the file to exist in production

Describe the solution you'd like
I'd like a built-in draft mode.

Describe alternatives you've considered
I've added a setting to the front matter to exclude the files from my sitemap.xml and I comment them out of the navigation - but the draft is still generated as a page in the output directory

[Peter deHaan]

@pbowyer I know you're asking for a built-in mode, but for future travellers, I believe the current solution is a combination of eleventyExcludeFromCollections: true and permalink: false to prevent draft pages from being written.

[Peter Bowyer]

@pdehaan Never thought of permalink: false - that may be the trick I've missed!

[Peter deHaan]

Ah, apologies. I assumed you were just asking for an EASIER way to do draft modes (which I also agree with).

https://www.11ty.dev/docs/permalinks/#permalink-false is a good place to start reading. And I recall a few really good discussions in the issues and forums about it. I'll see if I can dig any up.

[Peter deHaan]

• #2045; was a recent conversation I was trying to remember.
• #1950; a similar discussion and shows how you could alias eleventyExcludeFromCollections (which is a mouthful) to something like hidden: true in your frontmatter.

Probably a bunch more interesting threads if you search issues/discussions for permalink.

[Peter deHaan]

In fact, here was my solution.

// ./src/src.11tydata.js
module.exports = {
  eleventyComputed: {
    permalink(data) {
      // If the page is in `draft:true` mode, don't write it to disk...
      if (data.draft) {
        return false;
      }
      // Return the original value (which could be `false`, or a custom value,
      // or default empty string).
      return data.permalink;
    },
    eleventyExcludeFromCollections(data) {
      // If the page is in `draft:true` mode, or has `permalink:false` exclude
      // it from any collections since it shouldn't be visible anywhere.
      if (data.draft || data.permalink === false) {
        return true;
      }
      return data.eleventyExcludeFromCollections;
    }
  }
};

Posted my sample repo at https://github.com/pdehaan/11ty-drafts

[pracplay open code]

initially also tried to use draft:true, obv didn't work.

per this issue tried to use permalink: false

page didn't render but still showed in collections, so generated a 404 (also seems this is expected)

then tried to add various combinations of following (to module.exports and to global .eleventy.js file) to fix latter, w/ no success :

eleventyExcludeFromCollections: true;
eleventyExcludeFromCollections = true,

perhaps where to add this is implicit based on some other resource. (tried eleventyComputed suggestion from OP but copy/paste w/bracket-count check didn't parse properly).

since everybody that has a site creates drafts, this is probably something that could be simplified further imho.
(hate trying to play javascript-magic-guess-game, bc hard to remember/maintain those things)

[pracplay open code]

after a lot of looking, this is clealy being held off in eleventy.

whether this is reason or not, fairly easy to do:

mv news/post ../drafts/  # or news/some-post.html

benefits:

• avoids understanding any subtleties (draft-vs-post)
• no need to redefine collections based on tags
• still version controlled :) :)

[Zach Leatherman]

I think you can improve on that approach using the Configuration API for ignores. I like that folks can decide what convention they want to use for drafts (the example below uses a _ prefix and a .md suffix).

module.exports = function(eleventyConfig) {
  if(process.env.CI) {
    eleventyConfig.ignores.add("**/_*.md");
  }
};

In this example process.env.CI is set by your CI server, e.g. https://docs.netlify.com/configure-builds/environment-variables/#netlify-configuration-variables

[Zach Leatherman]

Let’s consider #188 the home base for this, please subscribe over there