gregives / eleventy-load Goto Github PK

I already have a build system for SCSS set up. I am using Bootstrap 5 SCSS.I wanted to use eleventy-load for only a JavaScript builder.

However, even though I had not installed eleventy-load-css or added config for SCSS in .eleventy.js, when building the site all of my SCSS files are now in dist/css in the same folder structure as my source.

Example: source file src/scss/utilities/_typography.scss is built to dist/css/utilities/_typography.css with contents

src/scss/utilities/_typography.scss

This makes no sense to me. I tried using eleventy-load-sass but couldn't figure out how to get it to play nicely with the folder structure I'm already using for my SCSS files. So I've abandoned the plugin completely, sadly.

Raising an issue here so that there's a possibility of having this solved in future.

Eleventy 1.0.0 introduced custom template extensions that can process any file type (sass processing is given as an example). This feature may provide an alternative to eleventy-load, or opportunities to extend the rules api.

We should consider acknowledging custom templates in documentation and clarifying the value eleventy-load provides beyond custom template solutions.

It might be possible to use loader-runner to support webpack loaders which would dramatically increase the number of loaders available.

Eleventy versions: 0.12.x .. 1.0.x

Minimal reproducable case:
https://github.com/johnhunter/test-eleventy-load

When we have two top-level pages and one page in a sub-directory

index.md
contact.md
about/index.md

They all share a single layout that contains a stylesheet. When built, if we just have the top-level files then the a single css asset file is output as expected. However, with the nested source page:

Steps:

• Checkout the repo and npm install
• Run the dev build npm start

Expected:

• All pages contain a stylesheet link to a single css asset

Actual:

• The css asset file is output to _site/contact/assets
• The nested about/index page fails to transform the stylesheet link to the output css asset.
• The other pages have a 404 stylesheet link that assumes the file is output to _site/assets

It's easy to forget about path differences on windows. Add a task in CI to run tests in a windows container.

I'm not sure this project is actively maintained. Personally I'm no longer using it and do not have the time to commit to maintenance. There are a few outstanding bugs that would probably involve significant rework. Additionally, 11ty v2 has better support for processing asset files so there is less need for projects like this.

@gregives perhaps its time to archive?

If anyone relies on this project, or wants to carry it forward please reach out.

Thanks,
John.

It might be worth automating the package publishing in CI. It's not necessarily right for this project because it involves trade offs for security/convenience, and ultimately project control.

There would be decisions to make but it would reduce the chores involved in publishing.

One critical point is that we must ensure there is a code review step before any contributor's changes can be published.

The following article details the process and outlines the challenges https://hackernoon.com/publish-npm-packages-using-github-actions-a-how-to-guide-q31c34fg

Ultimately it may not be right for us, but worth consideration.

I got eleventy-load compiling Sass, but it also broke tag pages for me. I had filed an issue on eleventy before I figured this out. Even just loading the plugin with no rules causes this issue:

Using the simplest possible example, from the "zero-maintenance tag page" quick tip, I'm getting this issue:

1: Every tag page is the same: The content that appears in the "birds" archive is identical to the "frogs" archive.

2: The tag pages are wrong. Even though pages are generated at /tags/frogs/index.html and /tags/birds/index.html, it is not the correct content for either of them.

Every page is just a repeat of the page for the first collection Eleventy encounters. With the most basic example, I get the content for the all collection. If I filter out all, I get note. If I filter note, I get whatever comes next, and so on. I'm logging the current tag, so the pattern is clear.

I have a sample project here: https://github.com/freshyill/11ty-load-test

Take a look at the archive for links to the tag archive. Every tag archive page is generating an archive page for "second tag." Disabling the plugin fixes tag archives. Just including it in my .eleventy.js with an empty rule set will trigger this behavior.

Might be useful to add CI that will run the tests before a PR can be merged. I haven't used Github actions much but they are probably a good choice.

This change in 11ty changes the this referenced here:

this._config is no longer available, causing an error to be thrown:

Cannot read property 'inputDir' of undefined

When Eleventy 2.0.0 release is imminent we need to:

• Verify eleventy-load works with the new version
• Fix and add test mocks if 11ty plugin interface has changed
• Update the 11ty.compatibility field in package.json

Eleventy 2.0.0 milestone
https://github.com/11ty/eleventy/milestone/38

Creating a dependabot.yml config triggers a check for dependency updates. These will normally be run on Saturday morning, but I forgot they also get raised if you touch the config file 😳.

They are not assigned to anyone in particular but I'm happy to take these on. I'll check them in the next few days and merge if they look ok.