Unrecognized archive format

[ninadhatkar]

What version of Tailwind CSS are you using?

3.4.16

What build tool (or framework if it abstracts the build tool) are you using?

Next.js 15.1.0

What version of Node.js are you using?

For example: v22.12.0

What browser are you using?

N/A

What operating system are you using?

macOS [email protected]

Reproduction URL
Create nextjs project will following options

• npx create-next-app@latest

✔ What is your project named? … <project-name>
✔ Would you like to use TypeScript? … No / **Yes**
✔ Would you like to use ESLint? … No / **Yes**
✔ Would you like to use Tailwind CSS? … **No** / Yes
✔ Would you like your code inside a `src/` directory? … No / **Yes**
✔ Would you like to use App Router? (recommended) … No / **Yes**
✔ Would you like to use Turbopack for `next dev`? … No / **Yes**
✔ Would you like to customize the import alias (`@/*` by default)? … **No** / Yes
Creating a new Next.js app in /Users/<username>/Documents/projects/project-name.

Try installing tailwind

npm install -D tailwindcss postcss autoprefixer

Describe your issue

Created nextjs application using npm command as follows

- npx create-next-app@latest

✔ What is your project named? … <project-name>
✔ Would you like to use TypeScript? … No / **Yes**
✔ Would you like to use ESLint? … No / **Yes**
✔ Would you like to use Tailwind CSS? … **No** / Yes
✔ Would you like your code inside a `src/` directory? … No / **Yes**
✔ Would you like to use App Router? (recommended) … No / **Yes**
✔ Would you like to use Turbopack for `next dev`? … No / **Yes**
✔ Would you like to customize the import alias (`@/*` by default)? … **No** / Yes
Creating a new Next.js app in /Users/<username>/Documents/projects/project-name.

I was getting an error TAR_BAD_ARCHIVE error when selected Tailwind CSS as yes at the time of project creation. When it checked the npm logs it was having error installing cssesc and was not able to download this using the tar link as well. So tried creating the project without tailwind and it was successful and created a project.

Then I tried manually installing tailwind using documentation here https://tailwindcss.com/docs/guides/nextjs but faced the same issue.

Here is the npm debug logs for the same:

601 http fetch GET 304 https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz 48ms (cache skip)
602 warn tar TAR_BAD_ARCHIVE: Unrecognized archive format
603 silly tar Error: TAR_BAD_ARCHIVE: Unrecognized archive format
603 silly tar     at Unpack.warn (/usr/local/lib/node_modules/npm/node_modules/tar/lib/warn-mixin.js:21:40)
603 silly tar     at Unpack.warn (/usr/local/lib/node_modules/npm/node_modules/tar/lib/unpack.js:236:18)
603 silly tar     at Unpack.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:83:14)
603 silly tar     at Unpack.emit (node:events:536:35)
603 silly tar     at [emit] (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:313:12)
603 silly tar     at [maybeEnd] (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:468:17)
603 silly tar     at [consumeChunk] (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:476:21)
603 silly tar     at Unpack.write (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:427:25)
603 silly tar     at Unpack.end (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:548:14)
603 silly tar     at Pipe.end (/usr/local/lib/node_modules/npm/node_modules/minipass/dist/commonjs/index.js:116:23) {
603 silly tar   recoverable: false,
603 silly tar   cwd: '/Users/spruhahatkar/Documents/projects/stock-radar-fe/node_modules/cssesc',
603 silly tar   code: 'TAR_BAD_ARCHIVE',
603 silly tar   tarCode: 'TAR_BAD_ARCHIVE'
603 silly tar }
604 http fetch GET 200 https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.1.tgz 81ms (cache miss)
605 http fetch GET 200 https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz 83ms (cache miss)
606 http fetch GET 200 https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz 85ms (cache miss)
607 http fetch GET 200 https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz 84ms (cache miss)
608 http fetch GET 200 https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.74.tgz 92ms (cache miss)
609 http fetch GET 200 https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz 113ms (cache miss)
610 http fetch GET 200 https://registry.npmjs.org/browserslist/-/browserslist-4.24.3.tgz 141ms (cache miss)
611 http fetch GET 200 https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.20.tgz 140ms (cache miss)
612 verbose stack Error: TAR_BAD_ARCHIVE: Unrecognized archive format
612 verbose stack     at Unpack.warn (/usr/local/lib/node_modules/npm/node_modules/tar/lib/warn-mixin.js:21:40)
612 verbose stack     at Unpack.warn (/usr/local/lib/node_modules/npm/node_modules/tar/lib/unpack.js:236:18)
612 verbose stack     at Unpack.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:83:14)
612 verbose stack     at Unpack.emit (node:events:536:35)
612 verbose stack     at [emit] (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:313:12)
612 verbose stack     at [maybeEnd] (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:468:17)
612 verbose stack     at [consumeChunk] (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:476:21)
612 verbose stack     at Unpack.write (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:427:25)
612 verbose stack     at Unpack.end (/usr/local/lib/node_modules/npm/node_modules/tar/lib/parse.js:548:14)
612 verbose stack     at Pipe.end (/usr/local/lib/node_modules/npm/node_modules/minipass/dist/commonjs/index.js:116:23)
613 error code TAR_BAD_ARCHIVE
614 error TAR_BAD_ARCHIVE: Unrecognized archive format

May be to reproduce might have to clear the npm cache so it will try to reach the npm repository directly and don't point to local one as I am trying it on fresh laptop.

[hiranyey-enp]

Even we are facing the same issue and not able to build any frontend projects

[rohanbdhardwaj]

we are using Vite. We are also getting the same issue.

[Sayandeep06]

i am getting the same issue and someone scolded me for using the wrong directory without actually looking 😭

[hiranyey-enp]

This was happening due to NPM
https://status.npmjs.org/incidents/bxvmmvlqzfds
This is now fixed