@maiertech/gatsby-theme-<content_type>-core themes are themes that come
without any opinion on styling. The idea is that you shadow all page components
and use whatever you prefer for styling.
This theme on the other hand, is opinionated about styling. It wires up
Theme UI for use with
Gatsby and configures
as theme. You can use any other Theme UI preset by shadowing
This theme exports a
Layout component. For this component to work, you need to
define the following
site metadata in
|Site title for header and footer.
|Site author for footer.
|Navigation links for header and footer.
@maiertech/components compatible with Gatsby by using Gatsby’s Link component for all internal links.
|Wire up Theme UI for use with Gatsby.
This theme has package
as a dependency (you can look up the version in its
theme-ui relies on
@mdx-js/react as dependency (not peer dependency) and you can look
up the version in its
The moment you use
you normally install
@mdx-js/react as peer dependency. But at what version? If
yarn list --pattern mdx
and you see
@mdx-js/react more than once (at different versions), you might be
in trouble. Component
@mdx-js/react creates a context and
when nested works as intended only, when all instances use the same context. But
when the versions used by
gatasby-plugin-mdx differ, you end up
with conflicting contexts and the Theme UI styled MDX transformation breaks.
If you are unable to reconcile the version conflict yourself, your last resort
is to add a
resolutions property to your project root and decide which version
should be used everywhere:
This works with Yarn only and the
version should probably be the one from your
@mdx-js/react peer dependency.