Как настроить проект next.js с помощью Tailwindcss, когда уже используется структура Module.css ⇐ CSS

[Anonymous]

Я пытаюсь настроить Tailwindcss в моем проекте heally.js 14. Я уже использовал файлы module.css, но теперь я хочу перейти на Tailwindcss. Я не хочу конвертировать мои старые компоненты в Taillide, просто хочу построить новые компоненты с Tailwindcss. Я установил Tailwindcsss и попытался настроить его, но я получаю следующее предупреждение, и стили Tail Whare не являются ограниченными < /p>

Код: Выделить всё

warn - No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.
warn - https://tailwindcss.com/docs/content-configuration
< /code>
Вот мой файл tailwind.config.js < /p>
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
'./pages/**/*.{html,js,tsx}',
'./components/**/*.{html,js,tsx}',
],
theme: {
extend: {},
},
plugins: [
require('daisyui'),
],
}

Моя структура файла - fe/src/*
module.css и Global.css Стили расположены в Fe/src/styles
Я также получил файл postcss.config.js < /p>

Код: Выделить всё

module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};
< /code>
Вот мой файл следующего.config.mjs < /p>
/** @type {import('next').NextConfig} */
const nextConfig = {
images: {
remotePatterns: [
{
protocol: 'https',
hostname: '*',
port: '',
pathname: '/**',
},
{
protocol: 'https',
hostname: 'placehold.co',
port: '',
pathname: '/**',
},
],
},
swcMinify: true,
compiler: {
styledComponents: true, // If you are using styled-components
},
webpack: (config) => {
return config;
}
};

export default nextConfig;
< /code>
Вот мой файл package.json < /p>
{
"name": "Missari",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint",

},
"dependencies": {
"@babel/core": "^7.26.0",
"@babel/node": "^7.26.0",
"@babel/preset-env": "^7.26.0",
"@prisma/client": "^5.20.0",
"autoprefixer": "^10.4.20",
"axios": "^1.7.7",
"chart.js": "^4.4.4",
"cloudinary": "^2.5.1",
"css-loader": "^7.1.2",
"daisyui": "^4.12.14",
"dompurify": "^3.1.7",
"i": "^0.3.7",
"ical": "^0.8.0",
"next": "^14.2.14",
"npm": "^10.8.3",
"pino-pretty": "^11.2.2",
"postcss": "^8.4.49",
"prisma": "^5.20.0",
"react": "^18.3.1",
"react-chartjs-2": "^5.2.0",
"react-dom": "^18.3.1",
"react-icons": "^5.3.0",
"react-quill": "^2.0.0",
"style-loader": "^4.0.0",
"tailwindcss": "^3.4.15",
"zustand": "^5.0.0-rc.2"
},
"devDependencies": {
"@types/ical": "^0.8.3",
"@types/json-schema": "^7.0.15",
"@types/node": "^20.16.10",
"@types/react": "^18",
"@types/react-dom": "^18",
"eslint": "^8",
"eslint-config-next": "14.2.9",
"ts-node": "^10.9.2",
"typescript": "^5.6.2"
}
}

Как я могу настроить свой проект следующего.js с Tailwindcss при сохранении стилей module.css?

Подробнее здесь: https://stackoverflow.com/questions/792 ... cture-is-a