-
Notifications
You must be signed in to change notification settings - Fork 237
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
[SPIKE] [WIP] 11ty spike #2750
base: main
Are you sure you want to change the base?
[SPIKE] [WIP] 11ty spike #2750
Conversation
We want to migrate everything to eleventy. Rather than trying to figure out what isn't needed, it's easier to just figure out what is needed.
We want to see what eleventy can do for us without custom scripts.
Finds layouts and partials, but not from govuk-frontend.
It wasn't catching the `.eleventy.js` file.
Now `npx eleventy` is failing because some custom globals are not available.
eleventy includes slugify by default, so let's try using that instead of slugger. This might break some links though, we'll need to keep an eye on it.
eleventy has an official syntax highlighter plugin, but until we can consistently check the compiled site, we'll stick with what we had before.
I figured out (by accident) that the `trim` error was occuring in `getHTMLCode`, this commit makes it print the error that prevents it from being able to get HTML from a file.
Just move all the template path info to the function itself for now. Can refactor more DRY-ly later!
eleventy now successfully compiles to `deploy/public`, with a bunch of quirks. Next steps are to squash the diffs between what the current compiled website looks like, and what eleventy produces. Following that, refactoring the whole lot and getting rid of unneeded code [might be beyond the scope of this spike]
✅ You can preview this change here:
To edit notification comments on pull requests, go to your Netlify site settings. |
Regarding navigation: I've always found the first-party Eleventy Navigation plugin to be a bit naff. Configuring it is pretty verbose and is split across the frontmatter of several files, making updates often a bit awkward, and the way it describes parent–child page relationships is also pretty flaky, in my experience. If we also end up finding it a bit awks, it might be worth trying to reproduce our existing navigation code in a global JavaScript data file instead. |
RE: metalsmith
Landed in 2.6.0: https://metalsmith.io/news/2023-05-30/metalsmith-2.6-released/ Improvements for the in-place plugin's limitations are on the radar and will be tackled when bandwidth allows (tracked in Thank you for sharing the pain points during metalsmith development, it's hard to get by valuable feedback! |
Thanks @webketje, appreciate the reply
Update: Moved comments to a PR to try it out but raised an issue to discuss there instead |
What
This spike builds on earlier work to investigate the feasibility of replacing Metalsmith with Eleventy for building the Design System Website.
Why
We chose to build the site with Metalsmith back in 2017, before the static site generator ecosystem had matured (eleventy, for example, had its first commit in November 2017).
From 2018 to 2021, Metalsmith was barely maintained, and we had to do some slightly awkward workarounds as we build functionality (probably the most obvious example of this was naming all our markdown files
.md.njk
, so that we could process the Nunjucks first usingmetalsmith-in-place
).Metalsmith's maintenance has picked up recently, but there are a lot of intriguing alternatives that are well-maintained and have a healthy community.
Eleventy has built-in support for a lot of the stuff we want to do (eg: the aforementioned Nunjucks within Markdown processing, and built-in watching/serving). It's also fast, and should solve a current problem we have with needing to rebuild the entire site when we change files during development.
Findings
We stripped back the repo to a bare minimum, dropping dependencies in order to figure out how to migrate to eleventy. I've slowly added features back in, trying to do so in a more eleventy-appropriate fashion, until the code compiles. There's a pretty big diff file, though - none of the navs are rendering, for example, but eleventy has a very different way of generating navs.
Next steps would be to work toward there being no diff in the compiled output, which would involve a bit more work to "eleventy-ise" the repo. Also to serve and watch the site using eleventy's dev server. Once we reach parity with the current set up, we could explore leaning more into eleventy, or figure out an iterative way to switch with the least amount of change if we decided that we did want to switch.
We should also decide if we even need to leave Metalsmith - we've removed a lot of outdated plugins (and figured out how to change our
.md.njk
files to plain ol'.md
), it's pretty well maintained right now, and there are plans for a built-in watch server which should speed up rebuilds.This work could tie into ongoing content audit work.