NuxtN
Nuxt•2y ago•
3 replies
Yassaaa

Tailwind CSS: Unhandled exception: require() of ES Module

How to fix this error I keep getting in WebStorm's notification sidebar when I am running bun run dev:
Tailwind CSS: Unhandled exception: require() of ES Module D:\WebDev\nuxtApp\node_modules\@nuxtjs\tailwindcss\dist\runtime\merger.mjs not supported. Instead change the require of D:\WebDev\nuxtApp\node_modules\@nuxtjs\tailwindcss\dist\runtime\merger.mjs to a dynamic import() which is available in all CommonJS modules. Error [ERR_REQUIRE_ESM]: require() of ES Module D:\WebDev\nuxtApp\node_modules\@nuxtjs\tailwindcss\dist\runtime\merger.mjs not supported. Instead change the require of D:\WebDev\nuxtApp\node_modules\@nuxtjs\tailwindcss\dist\runtime\merger.mjs to a dynamic import() which is available in all CommonJS modules. at Object.  (d:\WebDev\nuxtApp\.nuxt\tailwind.config.cjs:2:22)

here is my package.json:
{
  "name": "nuxt-app",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "@getbrevo/brevo": "^2.1.1",
    "@vercel/speed-insights": "^1.0.11",
    "nuxt": "^3.11.2",
    "vue": "^3.4.27",
    "vue-router": "^4.3.2"
  },
  "devDependencies": {
    "@nuxt/image": "^1.7.0",
    "@nuxtjs/device": "^3.1.1",
    "@nuxtjs/tailwindcss": "^6.12.0",
    "@storyblok/nuxt": "^6.0.10",
    "@tailwindcss/forms": "^0.5.7",
    "daisyui": "^4.11.1",
    "nuxt-icon": "^0.6.10",
    "nuxt-twemoji": "^3.5.0",
    "nuxt-viewport": "^2.1.5"
  }
}
Was this page helpful?