why not a gatsby plugin?
peduarte opened this issue Β· comments
Hey!
I've been looking through how other CSS-in-JS libraries work with Gatsby, and I realised that they usually are Gatsby Plugins and not Gatsby Themes.
I'm working on adding a dedicated page on the Stitches Docs about using it with Gatsby, and wanted to link to this package.
But first, I thought I'd ask: what's the reason this is a theme and not a plugin?
Thanks!
Hey @peduarte ! Thank you for the good question.
The gatsby-plugin-stitches was my first attempt, but I realized that to share an instance of it with the ssr process I had to access it with component shadowing instead of just a config.
It is actually similar to the way gatsby-plugin-theme-ui deals with it.
I renamed it to gatsby-theme-stitches to clarify that it uses component shadowing. But it's still a plugin, all gatsby plugins are also a theme. No problem to refer to this project as "gatsby plugin".
more detail:
If it needs a just serializable configuration (ex, config for a webpack plugin), we can pass options in gatsby-config and initialize something in gatsby-node.
But in stitches, the user has to create a styled instance as a javascript module and use it directly and there is no way for the plugin to know it. We have to share the structure with the user codebase.
Fortunately, Gatsby provides a means to override it while sharing the module structure through a special configuration called component shadowing or theme in general and every gatsby plugin can use/can be it.
Perfect explanation, makes sense to me. Thank you <3
the feature "theme" in Gatsby was initially designed as a different system, but it has integrated with the plugin in beta.
The name change was a consideration for the Gatsby community, but the discussion is open :) I am willing to change it back if you prefer the gatsby-plugin-stitches name more.
No need, I agree that using the term theme clarifies that it uses component shadowing.