Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Twind not working with Gatsby according to docs

See original GitHub issue

Good afternoon Twind maintainers 👋

I found Twind on twitter a couple weeks ago and since I found it I have been migrating away from twin.macro and to twind in favor of the more simplistic approach and bundle size.

I am currently re-writing my gatsby-scalable-starter template to use Twind and am removing all unnecessary packages.

I am looking at the docs here that say how to use Twind with Gatsby and I am copying the docs line for line but am getting a build error when trying to start the project.

Error:

Repo/code: https://github.com/LinnJS/gatsby-scalable-starter/pull/20

Any advice on how to resolve this error would be super helpful more than willing to update the documentation as well 😃

Issue Analytics

State:
Created 2 years ago
Comments:9 (1 by maintainers)

Top GitHub Comments

1reaction

LinnJScommented, Jan 3, 2022

Hey y’all still struggling with this Gatsby setup for twind. I have decided I am going to go back to using twin.macro and try to use twind patterns so when I figure this out I can go back to twind.

When I am done merging my PR I will open another PR to play with twind to see if I can resolve this later. Just need to build still and don’t have time for config problem right now.

I am going to keep this this issue open, hope it gets resolved.

0reactions

sastancommented, Jan 25, 2022

There is a working gatsby-plugin-twind (Example) for twind v1.

Right now I do not have the time to update v0.16. If you need this for v0.16 please re-open and we will see what we can do,

Top Results From Across the Web

tw not working with Goober/Gatsby #383 - GitHub

Styles are showing up as object when using tw inside of a component. Reproduction here import tw,{ styled } from 'twin.macro'; const Button ......

Gatsby - Twind

The smallest, fastest, most feature complete tailwind-in-js solution in existence.

Adding external css and js will not working in Gatsby js

According to Gatsby's docs you need to point your static/external assets using relative paths, such as (extracted from their documentation):

Install Tailwind CSS with Gatsby

Install Tailwind CSS ... Using npm, install tailwindcss and its peer dependencies, as well as gatsby-plugin-postcss , and then run the init command...

The Great Gatsby - Thomas Deacon Academy

In The Great Gatsby's nine chapters, Fitzgerald presents the rise and fall of Jay Gatsby, as related in a first-person narrative by Nick...