webc
webc copied to clipboard
Published
20 hours ago •
11ty
11ty
Content caching when using `webc:setup`
I tried accessing the built-in content variable in webc:setup, which stores the contents of the template for some manipulation/transformation, and got unexpected behavior.
I have this structure:
_includes
├─ base.webc
└─ child.webc
a.md
b.md
eleventy.config.js
base.webc
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body @html="content"></body>
</html>
child.webc
---
layout: base.webc
---
<script webc:setup>
// some content processing, wrapping with <article> just for example
const processedContent = `<article>${content}</article>`;
// for a.md the content should be <h1>A content</h1>
// for b.md the content should be <h1>B content</h1>
// But for b.md the content is actually <h1>A Content</h1>
</script>
<div class="some-wrapper">
<slot @raw="processedContent"></slot>
</div>
a.md
---
layout: child.webc
---
# A content
b.md
---
layout: child.webc
---
# B content
eleventy.config.js
const pluginWebc = require("@11ty/eleventy-plugin-webc");
module.exports = function(eleventyConfig) {
eleventyConfig.addPlugin(pluginWebc);
};
But after build I have the same content for both templates:
_site/a/index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body><div class="some-wrapper">
<article><h1>A content</h1>
</article>
</div></body>
</html>
_site/b/index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body><div class="some-wrapper">
<article><h1>A content</h1>
</article>
</div></body>
</html>
It looks like the content variable is cached and uses the content of the first template every time.
Windows 10 11ty/[email protected] 11ty/[email protected] Test repo
