Styles injected into a directory under every page

kylesloper commented 3 years ago

Hey there, trying to use this really awesome plugin with this starter.

With the current syntax used with the plugin in .eleventy.js, styles are being injected into a new directory under every single page (see below)

Here is my config:

  eleventyConfig.addPlugin(styles, {
    inputDirectory: "styles",
    publicDirectory: "/styles",
    addWatchTarget: true
  });

And finally here is the terminal after running the plugin:

npx eleventy --serve
Writing .www/sitemap.xml from ./sitemap.njk.
Writing .www/tags/index.html from ./tags.njk.
 19:15:49 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:50 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:50 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:51 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:52 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:52 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:52 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:52 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:52 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:52 -> Styles: Start compiling "styles.scss" stylesheet. 🆙
 19:15:54 -> Styles: Compiled CSS was written to ".www\authors\moonface-team\styles\styles.css" ��
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/authors/moonface-team/index.html from ./author.njk.
 19:15:54 -> Styles: Compiled CSS was written to ".www\blog\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/blog/index.html from ./pages/blog.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\authors\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/authors/index.html from ./authors.njk.
 19:15:54 -> Styles: Compiled CSS was written to ".www\about\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/about/index.html from ./pages/about.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\contact\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/contact/index.html from ./pages/contact.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/index.html from ./pages/home.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\services\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/services/index.html from ./pages/services.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\works\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/works/index.html from ./pages/works.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\posts\goodbye-ux-and-ui..-hello-hx-and-hi\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/posts/goodbye-ux-and-ui..-hello-hx-and-hi/index.html from ./posts/goodbye-ux-ui-hello-hx-hi.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\posts\hey-there-we're-moonface\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/posts/hey-there-we're-moonface/index.html from ./posts/hey-there-were-moonface.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\posts\introducing-moonface-cockpit\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/posts/introducing-moonface-cockpit/index.html from ./posts/introducing-moonface-cockpit.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\posts\what-is-the-jamstack-and-why-do-we-love-it\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/posts/what-is-the-jamstack-and-why-do-we-love-it/index.html from ./posts/what-is-the-jamstack-and-why-do-we-love-it.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\posts\the-downfall-of-'.com'-and-what-makes-a-good-domain\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/posts/the-downfall-of-'.com'-and-what-makes-a-good-domain/index.html from ./posts/the-downfall-of-com-and-what-makes-a-good-domain.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\privacy\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/privacy/index.html from ./pages/privacy.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\styles\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/styles/index.html from ./pages/styles.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\tos\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/tos/index.html from ./pages/tos.md.
 19:15:54 -> Styles: Compiled CSS was written to ".www\styles\styles.css" 🙌
 19:15:54 -> Styles: Public URLs of compiled styles were injected into HTML 🙌
Writing .www/404.html from ./404.md.
Copied 102 files / Wrote 19 files in 5.99 seconds (315.3ms each, v0.12.1)
Watching…

Is this the correct configuration for my file structure.. or is the plugin doing as expected and creating a new styles directory under each page in the site (which is obviously bulking up the site).

Cheers.

Kapelianovych commented 3 years ago

Hello! Thank you for your issue! Can you tell name of your output directory, please? It is strange behaviour for plugin 🤔 All styles should be inside output directory + public directory. As I see, you want to take styles from styles and write compiled files to the same directory.

kylesloper commented 3 years ago

My output directory is set to .www

Kapelianovych commented 3 years ago

Hi! Sorry for late response. Try removing leading slash from publicDirectory. Although I could not replicate your issue 🙁

Halo-Lab / eleventy-plugin-styles

Styles injected into a directory under every page #1