在NextJS 13中使用路由组停止顺风工作

p5fdfcr1  于 2023-11-18  发布在  其他
关注(0)|答案(2)|浏览(103)

在我的NextJS 13应用程序中,当我将page.tsx/layout.tsx从应用程序目录的根目录移动到(主)目录(也在应用程序目录的根目录中)时,Tailwind类将停止应用。我想当我使用路由组时,某处的某些配置将变得无效,但我不确定它是什么。
这是我的tailwind.config文件:

import type { Config } from 'tailwindcss'

const config: Config = {
  content: [
    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
  ],
  theme: {
    extend: {
      backgroundImage: {
        'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
        'gradient-conic':
          'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
      },
    },
  },
  plugins: [],
}
export default config

字符串

jpfvwuh4

jpfvwuh41#

在我的例子中,我在另一个文件夹中创建了一个UI组件,忘记将其添加到tailwind.js中的(内容)部分。但如果不是你的情况,也可以检查这个解决方案,这在tailwindGitHub问题中提到:

content: [
'./src/app/(group-name)/**/*.{js,ts,jsx,tsx,mdx}',
]

字符串

6jjcrrmo

6jjcrrmo2#

你需要导入globals.css,在那里你有指令:

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

字符串
在新路由组的所有根目录中。根目录中只能有1个全局css

相关问题