Tailwind/React/Monorepo: The `content` option in your Tailwind CSS configuration is missing or empty

698 views Asked by At

I've apparently configured Tailwind correctly in my React project, which is on a Monorepo. However, I get this message as if I hadn't defined the content in tailwind.config.js yet, but I have.

warn - The `content` option in your Tailwind CSS configuration is missing or empty.
warn - Configure your content sources or your generated CSS will be missing styles.
warn - https://tailwindcss.com/docs/content-configuration

tailwind.config.js file:

    /** @type {import('tailwindcss').Config} */ 
    module.exports = {  
        content: ['./src/**/*.{jsx, tsx}', 'public/index.html'],   
        theme: {
            extend: {},   
        },   
        plugins: [], 
    }

main.tsx:

import { StrictMode } from 'react';
import * as ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import './main.css';

import App from './app/app';

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <StrictMode>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </StrictMode>
);

main.css:

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

postcss.config.js:

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}

What else can I try?

0

There are 0 answers