This content originally appeared on DEV Community and was authored by Kazutora Hattori
Introduction
When installing Tailwind CSS v4 in a React + Vite environment,
the following error occurred immediately after starting the development server:
Cannot find module 'function qt(e={}){...}'
Require stack:
- postcss.config.js
This article summarizes how to fix this error.
Cause
The Tailwind v3 configuration is being used for Tailwind v4.
Doesn't work with Tailwind v4.
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};
Solution
1. Place index.css in the correct location.
Create (or modify) src/index.css.
@tailwind base;
@tailwind components;
@tailwind utilities;
2. Rewrite PostCSS configuration for Tailwind v4.
Change postcss.config.js to the v4-specific syntax:
import tailwindcss from "@tailwindcss/postcss";
export default {
plugins: [
tailwindcss(),
],
};
Summary of results after restoration
Tailwind styles are back, and the layout is back to normal.
This content originally appeared on DEV Community and was authored by Kazutora Hattori
Kazutora Hattori | Sciencx (2025-12-03T07:13:34+00:00) Summary of the error “Cannot find module ‘function qt(e={})…'” that occurs when using Tailwind CSS v4 + Vite. Retrieved from https://www.scien.cx/2025/12/03/summary-of-the-error-cannot-find-module-function-qte-that-occurs-when-using-tailwind-css-v4-vite/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.