Brad Cornes
Brad Cornes
@pradel the config goes in a [`babel-plugin-macros` config file](https://github.com/kentcdodds/babel-plugin-macros/blob/master/other/docs/user.md#config-experimental). For `styled-components` you would want: ```js module.exports = { tailwind: { styled: 'styled-components' } } ``` Is that what you have?
Hey @Shaderpixel Yeah so instead of this (which still works): ```js import styled from '@emotion/styled' import tw from 'tailwind.macro' const Paragraph = styled.p` ${tw`flex justify-center items-center bg-gray-500`} `; ``` ...you...
I have put together a PR for @jlengstorf's Gatsby demo which uses the alpha release: https://github.com/jlengstorf/gatsby-tailwind-demo/pull/8
No problem! Let me know if you run into any other issues, or have any questions/suggestions. Let's leave this open until it's released properly :)
@ockam Gatsby [supports `babel-plugin-macros` out-of-the-box](https://www.gatsbyjs.org/docs/babel-plugin-macros/) 🙌
Are you using the [default Tailwind v1 config](https://github.com/tailwindcss/tailwindcss/blob/next/stubs/defaultConfig.stub.js) (or no config)? If you are there is no `bg-pink` or `text-red`. Maybe try `bg-pink-500` or `text-red-500`
Hah no worries, I do the same thing when testing Tailwind v1 stuff. `bg-red` was my go-to test class 😅 We should probably throw an error when a class name...
@DevanB I’ve looked into this and there’s actually [a bug in `babel-plugin-styled-components`](https://github.com/styled-components/babel-plugin-styled-components/issues/179) that prevents it from working with `tailwind.macro`. The Tailwind macro produces code that looks like this: ```js import...
@DevanB I’ve just published an update (`v1.0.0-alpha.3`) that will hopefully fix the issues with the styled-components babel plugin: `npm install tailwind.macro@next` I think you might need to have `babel-plugin-macros` before...
@DevanB Apologies, I misunderstood initally. After looking in to it properly and actually trying it in CRA I _think_ I’ve got it working. My `babel-plugin-macros.config.js`: ```js module.exports = { tailwind:...