11ty / eleventy

A simpler site generator. Transforms a directory of templates (of varying types) into HTML.
https://www.11ty.dev/
MIT License
17.2k stars 493 forks source link

Using `input: "."` with programmatic API when eleventy setup is in another folder does not work #3281

Closed MangelMaxime closed 4 months ago

MangelMaxime commented 6 months ago

Operating system

macOS Sonoma 14.4

Eleventy

3.0.0-alpha.10

Describe the bug

When using the programmatic API, it seems like using input: "." does not work anymore relatively to the input directory.

I need to use to provide the absolute path instead.

import { dirname, filename } from 'dirname-filename-esm';

const __dirname = dirname(import.meta);

/** @param {import("@11ty/eleventy/src/UserConfig")} eleventyConfig */
export default function (eleventyConfig) {
    console.log("Custom Eleventy config file");

    // Configure Eleventy options to your liking
    return {
        dir: {
            // input: ".", // Does not work with programmatic usage
            input: __dirname,
            output: "_site",
        },
        dataTemplateEngine: "njk",
        htmlTemplateEngine: "njk",
        markdownTemplateEngine: "njk",
    };
};

Reproduction steps

  1. Clone https://github.com/MangelMaxime/eleventy-reproduction-programmatic-api-bug-1
  2. npm install
  3. npx vitest and see that the test fails
  4. Go to tests/fixtures/minimal/.eleventy.js and toggle the input configuration line
  5. Run npx vitest again and see that the test passes

Expected behavior

Using input: "." as shown below should work:

/** @param {import("@11ty/eleventy/src/UserConfig")} eleventyConfig */
export default function (eleventyConfig) {
    console.log("Custom Eleventy config file");

    // Configure Eleventy options to your liking
    return {
        dir: {
            input: ".",
            output: "_site",
        },
        dataTemplateEngine: "njk",
        htmlTemplateEngine: "njk",
        markdownTemplateEngine: "njk",
    };
};

Reproduction URL

No response

Screenshots

No response

zachleat commented 4 months ago

Just so I’m clear here, you’re calling Eleventy programmatically like this:

    const elev = new Eleventy(
        "./tests/fixtures/minimal/",
        "./tests/fixtures/minimal/_site",
        {
            configPath: "./tests/fixtures/minimal/.eleventy.js"
        } 
    );

This sets input to "./tests/fixtures/minimal/" and output to "./tests/fixtures/minimal/_site". What is the intent/purpose of returning dir in your config file? Those two values conflict.

MangelMaxime commented 4 months ago

I was not aware that they would conflict, it used to work in the past.

The main reason for setting dir in the config file, is like that I can also use eleventy CLI to run the project in a more standard way. This is useful for debugging purpose, as it allows me to use JavaScript debugger directly on the site generator.

It also allows me to check I didn't code something that works only for the programmatic API, in the past I found some minor difference in Eleventy behaviour when run using CLI or programmatic API. But perhaps, they were caused because I am setting the input/output using both the programmatic API and the config file.

Edit: If you think this is not a bug and the expected behaviour I can probably keep it the way it is or perhaps detect that I am running via a test runner using an Env variable so switch the config object.

zachleat commented 4 months ago

Yeah, I think what I’m trying to say is that we did some work to make these values consistent notably in #3244 (you can find the related ones from there). There are many different places to set the input and output directory but they never coalesce or merge together, they override each other.

I think the only thing you should have to do is remove your dir assignments in your config file?

MangelMaxime commented 4 months ago

I think the only thing you should have to do is remove your dir assignments in your config file?

Removing the dir configuration seems to be working indeed.

And because, I am using the similar default as:

dir: {
    input: ".",
    output: "_site",
},

I think all is good.