Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Assets not routing to _site (?) #1

Closed
arrowtype opened this issue Dec 14, 2020 · 5 comments
Closed

Assets not routing to _site (?) #1

arrowtype opened this issue Dec 14, 2020 · 5 comments

Comments

@arrowtype
Copy link

arrowtype commented Dec 14, 2020

UPDATE: I made a small error in my config, and there is a small error in this plugin, fixed by #2. I’m leaving this issue here in case it helps others, but closing it because the problem has been found, along with a (hopefully temporary) workaround.

@victornpb This seems like exactly what I am looking for in a basic image plugin for 11ty. I came across it in this issue comment. Thanks so much for taking the time to make it and share it!

Unfortunately, I’m having difficulties getting it to work so far. I’m using a setup (based on the 11ty-starter-blog) which I think should be working well, which so far really only has the customization of using permalinks.

Here is a public repo version of my WIP 11ty blog: https://github.com/arrowtype/blog--public_src

My input:

📁 src/posts/
  📁 2020-12-15--some-title/
    📄 index.md
    📁 assets/
      🖼 cover.png
      🖼 image.jpg
  📁 2020-06-18--good-title/
    📄 index.md 
    📁 assets/
      🖼 cover.png

My expected output is something like this (but I mostly just want it to work with controlled permalinks, and I’m not too worried about the specific asset folder structure):

📁 _site/posts/
  📁 some-title/
    📄 index.md
    📁 assets/
      🖼 cover.png
      🖼 image.jpg
  📁 good-title/
    📄 index.md 
    📁 assets/
      🖼 cover.png

So, if you visit one of the posts, you will see that the image is not yet getting copied in.

My .eleventy.js includes the following, as recommended in your readme with a couple of the options set:

const pageAssetsPlugin = require('eleventy-plugin-page-assets');

eleventyConfig.addPlugin(pageAssetsPlugin, {
      mode: "directory",
      postsMatching: "src/posts/*/*.md",
      recursive: true,
  });

However, the images just aren’t getting moved along with the posts.

I have my permalinks already working, following the default 11ty recommendations for using a permalink in my frontmatter. Potentially, might this process be tripping up the plugin? Or, am I missing a step?

Thank you for any thoughts or advice!

@tusamni
Copy link

tusamni commented Dec 22, 2020

Are you getting any issues when building the site? I have a similar structure and am getting issues when building the site.

@arrowtype
Copy link
Author

Nope, my build looks like this:

▶ npm run serve

> eleventy-base-blog@5.0.2 serve /Users/stephennixon/code/blog
> eleventy --serve

Writing _site/sitemap.xml from ./sitemap.xml.njk.
Writing _site/feed/feed.xml from ./feed/feed.njk.
Writing _site/feed/.htaccess from ./feed/htaccess.njk.
Writing _site/feed/feed.json from ./feed/json.njk.
Writing _site/404.html from ./404.md.
Writing _site/index.html from ./index.njk.
Writing _site/page-list/index.html from ./page-list.njk.
Writing _site/tags/index.html from ./tags-list.njk.
Writing _site/tags/tips/index.html from ./tags.njk.
Writing _site/posts/getting-started/index.html from ./posts/2020-05-01--getting-started-in-type/index.md.
Writing _site/posts/better-zips/index.html from ./posts/2020-08-25--making-better-zips/index.md.
Writing _site/posts/drawbot-vscode/index.html from ./posts/2020-06-15--drawbot-in-vscode/index.md.
Writing _site/posts/intro-to-fonttools/index.html from ./posts/2020-06-16--intro-to-fonttools/index.md.
Writing _site/posts/font-design-on-a-chromebook/index.html from ./posts/2020-11-01--font-design-on-a-chromebook/index.md.
Writing _site/posts/exploring-HOI/index.html from ./posts/2020-11-08--nonlinear-interpolation/index.md.
Writing _site/posts/robofont-tips/index.html from ./posts/2020-12-11--robofont-tips/index.md.
Writing _site/posts/name-sans-v04/index.html from ./posts/2020-12-15--name-sans-v04/index.md.
Writing _site/tags/tools/index.html from ./tags.njk.
Writing _site/tags/command line/index.html from ./tags.njk.
Writing _site/tags/font engineering/index.html from ./tags.njk.
Writing _site/tags/open source/index.html from ./tags.njk.
Writing _site/tags/drawbot/index.html from ./tags.njk.
Writing _site/tags/variable fonts/index.html from ./tags.njk.
Writing _site/tags/robofont/index.html from ./tags.njk.
Writing _site/tags/name sans/index.html from ./tags.njk.
Copied 4 files / Wrote 25 files in 0.27 seconds (10.8ms each, v0.11.1)
Watching…
[Browsersync] Access URLs:
 ---------------------------------
    Local: http://localhost:8080
 External: http://192.168.1.5:8080
 ---------------------------------
[Browsersync] Serving files from: _site

@arrowtype
Copy link
Author

I should add that this also fails for me with the default config recommendation from the README:

eleventyConfig.addPlugin(pageAssetsPlugin, {
      mode: "parse",
      postsMatching: "src/posts/*/*.md",
  });

@arrowtype
Copy link
Author

Oh; I did find one silly error on my part: I’m starting my project from https://github.com/11ty/eleventy-base-blog, and the posts are not in a src, but rather at the top level. So, my postsMatching was wrong, and should have been:

eleventyConfig.addPlugin(pageAssetsPlugin, {
      mode: "parse",
      postsMatching: "posts/*/*.md",
  });

So, now I am getting build errors:

Writing _site/tags/name sans/index.html from ./tags.njk.
Error writing templates: (more in DEBUG output)
> Having trouble writing template: _site/posts/drawbot-vscode/index.html

`TemplateWriterWriteError` was thrown
> Assignment to constant variable.

`TypeError` was thrown:
    TypeError: Assignment to constant variable.
        at Template.transformDirectoryWalker (/Users/stephennixon/code/blog-11ty/node_modules/eleventy-plugin-page-assets/src/plugin.js:110:16)
        at async Template.runTransforms (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Template.js:369:13)
        at async Template.renderPageEntry (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Template.js:609:15)
        at async Template.writeMapEntry (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Template.js:616:21)
        at async Promise.all (index 11)
        at async Eleventy.write (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Eleventy.js:743:13)
        at async Eleventy.watch (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Eleventy.js:650:5)
Problem writing Eleventy templates: (more in DEBUG output)
> Having trouble writing template: _site/posts/drawbot-vscode/index.html

`TemplateWriterWriteError` was thrown
> Assignment to constant variable.

`TypeError` was thrown:
    TypeError: Assignment to constant variable.
        at Template.transformDirectoryWalker (/Users/stephennixon/code/blog-11ty/node_modules/eleventy-plugin-page-assets/src/plugin.js:110:16)
        at async Template.runTransforms (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Template.js:369:13)
        at async Template.renderPageEntry (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Template.js:609:15)
        at async Template.writeMapEntry (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Template.js:616:21)
        at async Promise.all (index 11)
        at async Eleventy.write (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Eleventy.js:743:13)
        at async Eleventy.watch (/Users/stephennixon/code/blog-11ty/node_modules/@11ty/eleventy/src/Eleventy.js:650:5)
Copied 4 files / Wrote 0 files in 0.35 seconds (v0.11.1)
Watching…
[Browsersync] Access URLs:
 ----------------------------------
    Local: http://localhost:8080
 External: http://192.168.1.14:8080
 ----------------------------------
[Browsersync] Serving files from: _site

@arrowtype
Copy link
Author

At eleventy-plugin-page-assets/src/plugin.js:110:16, assets is set up as a const and a blank array. Then, the else block tries to redefine it. I think this is an error, as const should be immutable:

    const assets = [];
    if (pluginOptions.recursive) {
    for await (const file of walk(templateDir)) {
        assets.push(file);
    }
    } else {
    assets = await fs.promises.readdir(templateDir);
    assets = assets.map((f) => path.join(templateDir, f));
    }

And indeed – if I change that to let, it starts to work for me, bringing my images into the expected paths! I am going to test this a bit further, and I might make a PR if it seems to be a working solution...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants