安装nextjs后顺风不工作

Question

自从nextjs 13出现问题以来，我已经用同样的步骤安装了很多次Tailwind

这是我的包裹。为了复制，我使用npx create-next-app@latest并按照顺风文档安装nextjs。

这是我的json文件

{
"name": "fullstack",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"eslint": "8.37.0",
"eslint-config-next": "13.2.4",
"next": "13.2.4",
"react": "18.2.0",
"react-dom": "18.2.0"
},
"devDependencies": {
"autoprefixer": "^10.4.14",
"postcss": "^8.4.21",
"tailwindcss": "^3.3.0"
}
}

module.exports = {
content: [
"./app/**/*.{js,ts,jsx,tsx}",
"./pages/**/*.{js,ts,jsx,tsx}",
"./components/**/*.{js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
plugins: [],
}  ```
This is my tailwind config file 

Answer 1

试着在你的终端上运行这个:

npm install -D tailwindcss postcss autoprefixer

更新你的tailwind.config.js:

/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./app/**/*.{js,ts,jsx,tsx}",
"./pages/**/*.{js,ts,jsx,tsx}",
"./components/**/*.{js,ts,jsx,tsx}",
"./src/**/*.{js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
plugins: [],
}

更新global.css文件:

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

最后，确保global.css在pages/_app.js文件中被正确导入。