Diacritics and spaces seem not usable in file names

[Lamecarlate]

Hello!

I want to use this plugin, and I'm stuck… Because I have

ENOENT: no such file or directory

for every image with a space or an accented character in its name.

It seems the name is encoded on one end, but I fail to find which.

![Cool beach](<Beach wallpaper - by Glater.jpeg>)

fires the error

Error: ENOENT: no such file or directory, stat 'src/pages/carnet/2024/20240705.île-de-myst-en-lego/Beach%20wallpaper%20-%20by%20Glater.jpeg'

![Extrait de l'introduction, on voit une crevasse dans le ciel.](les-sous-titres-automatisés-de-youtube.jpg)

fires the error

Error: ENOENT: no such file or directory, stat 'src/pages/carnet/2024/20240705.île-de-myst-en-lego/les-sous-titres-automatis%C3%A9s-de-youtube.jpg'

I can live with removing spaces in the images name, it's a bit annoying but OK. However, removing diacritics is more painful: I write in french, a lot of my images have a french name, and an accent on a letter changes its meaning…

Moreover, it seems Eleventy can use accented letters in permalinks with no problem! "île-de-myst-en-lego" is accepted.

Is it something I can do, in configuration for example?

In eleventy.config.js I have

eleventyConfig.addPlugin(eleventyImageTransformPlugin, {
		// File extensions to process in _site folder
		extensions: "html",

		// Output formats for each image.
		formats: ["avif", "webp", "auto"],

		// widths: ["auto"],

		defaultAttributes: {
			// e.g. <img loading decoding> assigned on the HTML tag will override these values.
			loading: "lazy",
			decoding: "async",
		},
	});

ebb-v9-micro.zip

Attached is a small version of my project. Download, extract, npm install in the folder. Then npm run build or npm run start, it should fail with the errors I cited. The markdown file is here: ebb-v9-micro/src/pages/carnet/2024/20240705.île-de-myst-en-lego, you can comment the images to test.

Thanks a lot!

[zachleat]

To be clear, file names with diacritics and spaces are supported as-is. I added passing tests for this to check—without changes to the plugin code.

Looks like your directory name is using combining diacritics and the reference in your markdown code is using a different character:

[..."î"].map(char => char.codePointAt(0))
Array [ 238 ]

[..."î"].map(char => char.codePointAt(0))
Array [ 105, 770 ]

Make sure you’re using the same filename 😅

[Lamecarlate]

I'm sorry for insisting. Your unit tests are OK, it's great, really! But I do have a problem that I'm afraid your tests don't find. I made a new micro-project, from scratch (just https://www.11ty.dev/docs/ and https://www.11ty.dev/docs/plugins/image/, no diacritics in directory name, just in one image file name), and I still have the aforementioned problem. Could you, or someone else take this archive, uncompress it, launch npm install and npx @11ty/eleventy, just to check?

eleventy-sample.zip

I read your latest commit. I am indeed on Ubuntu (and Mint, depending on the computer). Maybe this is part of the trouble here?

[zachleat]

Ah, just learned some weird things about Markdown:

[Link](automatisés.jpg)
![Image](automatisés.jpg)
![Image](space in filenames.jpg)

outputs

<p><a href="automatis%C3%A9s.jpg">Link</a>
<img src="automatis%C3%A9s.jpg" alt="Image">
![Image](space in filenames.jpg)</p>

Workaround is to use HTML directly: <img src="automatisés.jpg" alt=""> outputs <img src="automatisés.jpg" alt="">

Changing this one to a bug.

[zachleat]

I maintain that this is officially a oddity in Markdown specifically! Note that to use spaces in your markdown file references you can use this syntax:

![alt text](<space in filenames.jpg>)

You can test this in markdown-it by itself: https://markdown-it.github.io/ or in CommonMark: https://spec.commonmark.org/dingus/

Regardless, the fix to decode these sources will ship with v6.0.0

[Lamecarlate]

Thank you, and sorry again. I'll look forward to v6.0.0.

In fact, I posted this as a bug because I was surprised. My current website uses Grav, I write in markdown, and never had a problem for spaces and diacritics, so I didn't understand 😅 I thought it was normal.