Builds fail when adding images from remotes in Markdown
Describe the bug When linking to an image in Markdown pages (whether it's done in the CMS or manually), a build error will result.
To Reproduce Steps to reproduce the behavior:
- Add image to Markdown file hosted on a remote URL, either using standard syntax in Markdown or by adding an image within CMS
- npm run build (or edit with npm start)
- See error
Expected behavior Image is pulled from remote as normal.
Desktop (please complete the following information):
- OS: macOS 15 Sequoia
- Browser: Safari
- Node version v20.18.0 and v16.20.2
Additional context
Output from npm start [11ty] Watching… [11ty] File changed: src/projects/sample.md [11ty] Problem writing Eleventy templates: (more in DEBUG output) [11ty] 1. Having trouble rendering njk template ./src/projects/sample.md (via TemplateContentRenderError) [11ty] 2. ENOENT: no such file or directory, stat '.https://img.staticeagles.com/nature_photos/IMG_2133.jpg' (via Error) [11ty] [11ty] Original error stack trace: Error: ENOENT: no such file or directory, stat '.https://img.staticeagles.com/nature_photos/IMG_2133.jpg' [11ty] at Object.statSync (node:fs:1666:25) [11ty] at Image.getInMemoryCacheKey (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy-img/img.js:161:32) [11ty] at queueImage (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy-img/img.js:827:15) [11ty] at markdown.renderer.rules.image (/Users/jasonadle/GitHub/ja-eleven-fern/src/_11ty/libraries/markdown-library.js:57:3) [11ty] at Renderer.renderInline (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/markdown-it/lib/renderer.js:275:28) [11ty] at Renderer.render (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/markdown-it/lib/renderer.js:330:22) [11ty] at MarkdownIt.render (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/markdown-it/lib/index.js:544:24) [11ty] at /Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy/src/Engines/Markdown.js:79:38 [11ty] at process.processTicksAndRejections (node:internal/process/task_queues:95:5) [11ty] at async Template._render (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy/src/TemplateContent.js:514:22) [11ty] Wrote 0 files (skipped 20) in 0.01 seconds (v2.0.1) [11ty] Watching…
Error output from npm build
eleventy
[11ty] Problem writing Eleventy templates: (more in DEBUG output) [11ty] 1. Having trouble rendering njk template ./src/projects/sample.md (via TemplateContentRenderError) [11ty] 2. ENOENT: no such file or directory, stat '.https://img.staticeagles.com/nature_photos/IMG_2133.jpg' (via Error) [11ty] [11ty] Original error stack trace: Error: ENOENT: no such file or directory, stat '.https://img.staticeagles.com/nature_photos/IMG_2133.jpg' [11ty] at Object.statSync (node:fs:1666:25) [11ty] at Image.getInMemoryCacheKey (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy-img/img.js:161:32) [11ty] at queueImage (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy-img/img.js:827:15) [11ty] at markdown.renderer.rules.image (/Users/jasonadle/GitHub/ja-eleven-fern/src/_11ty/libraries/markdown-library.js:57:3) [11ty] at Renderer.renderInline (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/markdown-it/lib/renderer.js:275:28) [11ty] at Renderer.render (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/markdown-it/lib/renderer.js:330:22) [11ty] at MarkdownIt.render (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/markdown-it/lib/index.js:544:24) [11ty] at /Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy/src/Engines/Markdown.js:79:38 [11ty] at process.processTicksAndRejections (node:internal/process/task_queues:95:5) [11ty] at async Template._render (/Users/jasonadle/GitHub/ja-eleven-fern/node_modules/@11ty/eleventy/src/TemplateContent.js:514:22) [11ty] Copied 19 files / Wrote 0 files in 0.14 seconds (v2.0.1) ERROR: "build:eleventy" exited with 1.
Output from build attempt in Cloudflare Pages
| 9:38:44.801 | Using v2 root directory strategy |
|---|---|
| 09:38:44.827 | Success: Finished cloning repository files |
| 09:38:46.512 | Checking for configuration in a wrangler.toml configuration file (BETA) |
| 09:38:46.513 | |
| 09:38:46.641 | No wrangler.toml file found. Continuing. |
| 09:38:46.718 | No build output detected to cache. Skipping. |
| 09:38:46.719 | No dependencies detected to cache. Skipping. |
| 09:38:46.820 | Detected the following tools from environment: [email protected], [email protected] |
| 09:38:46.821 | Installing nodejs 16.20.2 |
| 09:38:46.924 | nodejs 16.20.2 is already installed |
| 09:38:47.470 | Installing project dependencies: npm install --progress=false |
| 09:39:03.603 | npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-inject. |
| 09:39:03.663 | npm WARN deprecated [email protected]: Please use @jridgewell/sourcemap-codec instead |
| 09:39:04.125 | npm WARN deprecated [email protected]: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility |
| 09:39:04.415 | npm WARN deprecated [email protected]: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful. |
| 09:39:04.443 | npm WARN deprecated [email protected]: Glob versions prior to v9 are no longer supported |
| 09:39:05.950 | npm WARN deprecated [email protected]: Rimraf versions prior to v4 are no longer supported |
| 09:39:06.048 | npm WARN deprecated [email protected]: Rimraf versions prior to v4 are no longer supported |
| 09:39:10.735 | |
| 09:39:10.735 | added 554 packages, and audited 555 packages in 22s |
| 09:39:10.736 | |
| 09:39:10.736 | 137 packages are looking for funding |
| 09:39:10.736 | run npm fund for details |
| 09:39:10.739 | |
| 09:39:10.739 | 3 high severity vulnerabilities |
| 09:39:10.739 | |
| 09:39:10.739 | To address all issues possible (including breaking changes), run: |
| 09:39:10.739 | npm audit fix --force |
| 09:39:10.740 | |
| 09:39:10.740 | Some issues need review, and may require choosing |
| 09:39:10.740 | a different dependency. |
| 09:39:10.740 | |
| 09:39:10.740 | Run npm audit for details. |
| 09:39:10.765 | Executing user command: npm run build |
| 09:39:11.424 | |
| 09:39:11.425 | > [email protected] build |
| 09:39:11.425 | > cross-env npm-run-all build:sass build:scripts build:eleventy |
| 09:39:11.425 | |
| 09:39:12.009 | |
| 09:39:12.009 | > [email protected] build:sass |
| 09:39:12.009 | > sass --no-source-map src/assets/scss/main.scss _site/assets/css/main.css |
| 09:39:12.009 | |
| 09:39:12.930 | |
| 09:39:12.930 | > [email protected] build:scripts |
| 09:39:12.930 | > esbuild "./src/assets/js/main.js" --target=es6 --bundle --minify --outfile="./_site/assets/js/main.bundle.js" |
| 09:39:12.931 | |
| 09:39:12.959 | |
| 09:39:12.959 | _site/assets/js/main.bundle.js 40.2kb |
| 09:39:12.960 | |
| 09:39:12.960 | ⚡ Done in 13ms |
| 09:39:13.333 | |
| 09:39:13.334 | > [email protected] build:eleventy |
| 09:39:13.334 | > eleventy |
| 09:39:13.334 | |
| 09:39:14.194 | [11ty] Problem writing Eleventy templates: (more in DEBUG output) |
| 09:39:14.194 | [11ty] 1. Having trouble rendering njk template ./src/projects/swiftdialog-edr-alerts.md (via TemplateContentRenderError) |
| 09:39:14.195 | [11ty] 2. ENOENT: no such file or directory, stat '.https://raw.githubusercontent.com/jasonad123/dialog-edr-popup-inator/refs/heads/main/screenshots/high.png' (via Error) |
| 09:39:14.195 | [11ty] |
| 09:39:14.195 | [11ty] Original error stack trace: Error: ENOENT: no such file or directory, stat '.https://raw.githubusercontent.com/jasonad123/dialog-edr-popup-inator/refs/heads/main/screenshots/high.png' |
| 09:39:14.195 | [11ty] at Object.statSync (node:fs:1583:3) |
| 09:39:14.196 | [11ty] at Image.getInMemoryCacheKey (/opt/buildhome/repo/node_modules/@11ty/eleventy-img/img.js:156:32) |
| 09:39:14.196 | [11ty] at queueImage (/opt/buildhome/repo/node_modules/@11ty/eleventy-img/img.js:614:15) |
| 09:39:14.196 | [11ty] Copied 19 files / Wrote 0 files in 0.29 seconds (v2.0.1) |
| 09:39:14.196 | [11ty] at Object.markdown.renderer.rules.image (/opt/buildhome/repo/src/_11ty/libraries/markdown-library.js:57:3) |
| 09:39:14.196 | [11ty] at Renderer.renderInline (/opt/buildhome/repo/node_modules/markdown-it/lib/renderer.js:275:28) |
| 09:39:14.196 | [11ty] at Renderer.render (/opt/buildhome/repo/node_modules/markdown-it/lib/renderer.js:330:22) |
| 09:39:14.197 | [11ty] at MarkdownIt.render (/opt/buildhome/repo/node_modules/markdown-it/lib/index.js:544:24) |
| 09:39:14.197 | [11ty] at /opt/buildhome/repo/node_modules/@11ty/eleventy/src/Engines/Markdown.js:79:38 |
| 09:39:14.197 | [11ty] at processTicksAndRejections (node:internal/process/task_queues:96:5) |
| 09:39:14.197 | [11ty] at async Template._render (/opt/buildhome/repo/node_modules/@11ty/eleventy/src/TemplateContent.js:514:22) |
| 09:39:15.013 | ERROR: "build:eleventy" exited with 1. |
| 09:39:15.032 | Failed: Error while executing user command. Exited with error code: 1 |
| 09:39:15.043 | Failed: build command exited with code: 1 |
| 09:39:15.921 | Failed: error occurred while running build command |
it's adding a /. e.g., home.json is saved as
"image": "/src/assets/img/myphoto.jpg",
removing the / fixes it, but it will keep breaking every time you save
"image": "src/assets/img/myphoto.jpg",
This should be fixed now 8d15941e9fe195d27c261be96f54ecbca54fa419.
Example images added today: https://fernfolio.netlify.app/projects/cat-translation-api/