Tailwind CSS 不适用于 Next JS 12，但适用于 Next JS 11

Posted 2023-03-07

【中文标题】Tailwind CSS 不适用于 Next JS 12，但适用于 Next JS 11

【英文标题】：Tailwind CSS not working with Next JS 12, but works with Next JS 11

【发布时间】：2022-01-04 20:16:33

【问题描述】：

我已经使用 next js v12 为我的项目设置了 tailwind css。我已经相应地设置了清除和文件导入，它应该正确设置组件/页面的样式。然而..它没有。没有错误或任何东西。但是当我回滚到 Next JS v11 时，如果我不更改任何代码，就会应用样式。 我不明白为什么这对我来说是个问题，因为它似乎不是一个常见问题。

tailwind.config.js

module.exports = 
  mode: 'jit',
  purge: ['./pages/**/*.js,ts,jsx,tsx', './components/**/*.js,ts,jsx,tsx'],
  darkMode: 'false', // or 'media' or 'class'
  theme: 
    extend: ,
  ,
  variants: 
    extend: ,
  ,
  plugins: [],

globals.css

@tailwind base;
@tailwind components;
@tailwind utilities;


@layer base 
  html,
  body 
    padding: 0;
    margin: 0;
  
  

_app.tsx

import "../styles/globals.css";
import "tailwindcss/tailwind.css";

import type  AppProps  from 'next/app'

function MyApp( Component, pageProps : AppProps) 
  return <Component ...pageProps />


export default MyApp

【参考方案1】：

当我对其进行更改时，我忘记重新启动我该死的应用程序以编译配置。