Digvijay singh
Digvijay singh

Reputation: 171

Tailwind CSS (PostCSS Plugin) with Next.js 10.0.3 gives Javascript heap out of memory error in dev environment

To replicate the issue you can use this example and run in the dev environment.

https://github.com/vercel/next.js/tree/canary/examples/with-tailwindcss

The above example have also very high memory usage in dev environment which is not so common for next js applications.

I have tried the combination of different versions of tailwindcss and Next.js but the issue persists. PS: I am using Ubuntu 20.04 (If this would help in any way).

Upvotes: 2

Views: 1663

Answers (1)

KeshavDulal
KeshavDulal

Reputation: 4164

I too encountered this error FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory when I integrated Tailwind(2.2.2) on my NextJS (10.2) project.

Some github-issue discussions on Memory Leaks points to the use of optimized <Image/> component of NextJs. So I've temporarily reverted back to img tag and it's stable so far.

No an ideal solution but give it a try.

Also I've disabled JIT mode of Tailwind in development.

Github Discussions #1 #2

Upvotes: 1

Related Questions