让 styled-jsx 在 NextJS 中与 tailwindcss 一起工作

Getting styled-jsx to work with tailwindcss in NextJS

我正在尝试让 styled-jsx 与 NextJS 中的 tailwindcss 一起工作。

在上面的示例中，我尝试在 index.tsx 页面上找到 <h1>Hello World</h1> 以使用 tailwindcss 更改颜色。

例如，如果我将 styled-jsx 设置为 @apply text-red-400; ，我希望 h1 变成红色，但它没有。我知道 styled-jsx 正在工作，因为应用 color: green; 将 h1 更改为绿色。

我尝试用 styled-jsx-plugin-postcss 配置 babel 但它不起作用。

我不明白为什么它突然开始起作用了。我什至没有做出改变。看起来 nodejs 或 nextjs 需要休息一下...

我认为与 tailwindcss 相关的任何内容都不需要 styled-jsx。

您可以像这样直接使用 tailwind classNames 并应用样式：

<h1 className="text-green-400">Hello World</h1>