Allow CLI `--output=output.html` to override permalink of `--input=input.html` #3995

thecristen · 2022-01-20T18:07:03Z

thecristen
Jan 20, 2022

Describe the bug
I'm using Eleventy on the command line to compile a Nunjucks file into an HTML file. It works great but I'm having trouble getting the output to go where I want to. I want to compile the test.njk file I have in the root directory to test.html in the same directory. I've read the using the same input and output directory pitfall page, but I don't think it applies here.

To Reproduce
Contents of test.njk below, all of the included files are simple HTML files:

<!-- 
  I've got some redacted comments here
 -->
<html lang="en">
  <head>
  {% include "head.html" %}
  <body>
    <div class="body-wrapper" id="body-wrapper">
      {% include "header.html" %}
      <hr>
      {% include "footer.html" %}
    </div>
  {% include "scripts.html" %}
  </body>
</html>

Trying to compile:

eleventy --dryrun --input=test.njk --output=. 
[11ty] Skipping ./test/index.html from ./test.njk

eleventy --dryrun --input=test.njk --output=test.html
[11ty] Skipping test.html/test/index.html from ./test.njk

eleventy --dryrun --input=test.njk --output=./test.html
[11ty] Skipping ./test.html/test/index.html from ./test.njk

Expected behavior

I want test.html output to the root directory, not under a test or test.html folder.
Interestingly, it worked back when I had the file named index.html.

eleventy --input=index.njk --output=.          
[11ty] Writing ./index.html from ./index.njk
[11ty] Wrote 1 file in 0.10 seconds (v1.0.0)

Environment:

OS and Version: macOS Monterey 12.1
Eleventy Version 1.0.0

pdehaan · 2022-01-20T21:43:26Z

pdehaan
Jan 20, 2022
Collaborator

Actually, rereading your original comment of "I want to compile the test.njk file I have in the root directory to test.html in the same directory.", I think that pitfall does potentially apply (assuming Eleventy tries to parse the generated HTML files on subsequent builds). Or if you're strictly using Eleventy to build single templates and output to the same input directory (in which case the caveat might NOT apply).

My frontmatter comment might still stand. I guess it depends on how you're building.
Personally I find using the same input+output directories confusing, and I prefer to put all my templates in a subdirectory and then set the dir.input and dir.output directories in my .eleventy.js config file; but I understand that might not work for everybody's use cases.

If you want to throw your project up in a public GitHub repo I can take a look and see if we can get it building how you want it. I'm a bit curious about the HTML partials above for "head.html", "header.html", "footer.html", and "scripts.html".

~~@thecristen Nope, I don't think that pitfall applies to this, but you'll probably want to check out the https://www.11ty.dev/docs/permalinks/ docs.~~

TLDR: you can add a permalink: test.html to your frontmatter to change the output file on a per-template basis. But that can be tedious for large sites.
I'd have to play around with it a bit, but for multiple pages, we could set it in a directory data file, or possibly something like a global _data/eleventyComputed.js data file.
But yes, the index.xxx pages are a bit of a special case, as you see above.

0 replies

thecristen · 2022-01-20T21:50:01Z

thecristen
Jan 20, 2022
Author

Gotcha. I'm processing no other files in the entire project, so I was hoping to not have to add front matter or any other 11ty-specific configuration to the project to process the one file.

A use case to consider, perhaps, but good to know that the behavior I ran into is expected 🥲

0 replies

pdehaan · 2022-01-20T22:06:33Z

pdehaan
Jan 20, 2022
Collaborator

Ah, updated my comment above.

Also interesting point from your output above:

eleventy --dryrun --input=test.njk --output=test.html
[11ty] Skipping test.html/test/index.html from ./test.njk

So another gotcha is the --input flag

"Controls the top level directory/file/glob that we’ll use to look for templates."

Whereas the --output flag

"Controls the directory inside which the finished templates will be written to."

Which you can see from your output above: "test.html/test/index.html"

I'm still struggling to come up with a workaround that isn't permalink: test.html frontmatter in the test.njk template, or a directory data file like "test.11tydata.json" which applies frontmatter for that one specific file (but is one more file in your project). Or else some post-build script which simply renames/moves the generated ./test/index.html file to ./test.html, which would probably be easy if you already have a package.json file in the project.

0 replies

thecristen · 2022-01-20T23:07:34Z

thecristen
Jan 20, 2022
Author

Ahh good note about the documented difference in how the input and output flags work. Thank you for that.

Whereas the --output flag

"Controls the directory inside which the finished templates will be written to."

Noted! But doesn't this suggest that --output=. should output into the top level directory, then? 🤔

0 replies

pdehaan · 2022-01-21T05:22:07Z

pdehaan
Jan 21, 2022
Collaborator

But doesn't this suggest that --output=. should output into the top level directory, then? 🤔

Ah ha! Except it is writing to the top level directory! It's writing the output to "test/index.html" in the top-level directory (which is the same level as your .eleventy.js config file, or the ./test.njk file).

I have this working locally:

---
permalink: test.html
---

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
</head>
<body>

{% include "content.html" %}

</body>
</html>

Where my package.json "build" script looks like eleventy --input=test.njk --output=..
But if you don't want to add front matter (or can't for whatever reason), I think you might be stuck with the file being written to ./test/index.html and then moving/renaming it to the desired name/location.

For example, here's my package.json scripts section (when not using the permalink solution above):

  "scripts": {
    "build": "eleventy --input=test.njk --output=.",
    "postbuild": "mv test/index.html test.html",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

Now when I run npm run build it will run the build script (which builds the one Nunjucks template), and then the postbuild hook will automatically run after the npm run build script and move the file to the desired place.

I guess a final option might be seeing if you can use nunjucks-cli or something similar. I'm not sure which features of Eleventy you're using, but given my super simple example of just using {% include "xxx" %} in the simple templates above, I was able to compile with vanilla Nunjucks using:

npx nunjucks-cli "*.njk" -p ""

Not sure why I had to use that weird -p "" hack, but without it, I was getting some errors:

npx nunjucks-cli "*.njk"
node:internal/validators:120
    throw new ERR_INVALID_ARG_TYPE(name, 'string', value);
    ^

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined
    at new NodeError (node:internal/errors:371:5)
    at validateString (node:internal/validators:120:11)
    at resolve (node:path:1098:7)
    at Object.<anonymous> (/private/tmp/11ty-2184/node_modules/nunjucks-cli/main.js:55:18)
    at Module._compile (node:internal/modules/cjs/loader:1097:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1149:10)
    at Module.load (node:internal/modules/cjs/loader:975:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:17:47 {
  code: 'ERR_INVALID_ARG_TYPE'
}

Node.js v17.3.1

I'll file a bug in https://github.com/jeremyben/nunjucks-cli, but not sure how active that repo is. 🤷
UPDATE: Filed as jeremyben/nunjucks-cli#26

0 replies

zachleat · 2022-12-05T22:03:31Z

zachleat
Dec 5, 2022
Maintainer

Ah, this is the first time I’ve seen a request to override the permalink of --input=file with --output=file. I think it has some merit but unfortunately I don’t think I’ve seen other folks face this confusion. I’ll put it in the enhancement queue, thanks!

This repository is now using lodash style issue management for enhancements. This means enhancement issues will now be closed instead of leaving them open.

View the enhancement backlog here. Don’t forget to upvote the top comment with 👍!

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

Allow CLI `--output=output.html` to override permalink of `--input=input.html` #3995

Uh oh!

{{title}}

Uh oh!

Replies: 6 comments

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{editor}}'s edit

{{editor}}'s edit

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Uh oh!

Allow CLI --output=output.html to override permalink of --input=input.html #3995

Uh oh!

thecristen Jan 20, 2022

Replies: 6 comments

Uh oh!

Uh oh!

pdehaan Jan 20, 2022 Collaborator

Uh oh!

thecristen Jan 20, 2022 Author

Uh oh!

pdehaan Jan 20, 2022 Collaborator

Uh oh!

thecristen Jan 20, 2022 Author

Uh oh!

Uh oh!

pdehaan Jan 21, 2022 Collaborator

Uh oh!

zachleat Dec 5, 2022 Maintainer

Allow CLI `--output=output.html` to override permalink of `--input=input.html` #3995

thecristen
Jan 20, 2022

pdehaan
Jan 20, 2022
Collaborator

thecristen
Jan 20, 2022
Author

pdehaan
Jan 20, 2022
Collaborator

thecristen
Jan 20, 2022
Author

pdehaan
Jan 21, 2022
Collaborator

zachleat
Dec 5, 2022
Maintainer