'Next failed to load SWC binary

When trying to run the command using nextjs npm run dev shows error - failed to load SWC binary see more info here: https://nextjs.org/docs/messages/failed-loading-swc.

I've tried uninstalling node and reinstalling it again with version 16.13 but without success, on the vercel page, but unsuccessful so far. Any tips?

Also, I noticed it's a current issue on NextJS discussion page and it has to do with the new Rust-base compiler which is faster than Babel.

Solution 1:^[1]

Delete the package-lock.json file and the node_modules directory in your project and then run npm install on your terminal.

Solution 2:^[2]

This worked as suggeted by nextJS docs but it takes away Rust compiler and all its benefits... Here is what I did for those who eventually get stuck...

Step 1. add this line or edit next.json.js

{
swcMinify: false // it should be false by default 
}

Step 2. add a ".babelrc" file to project root dir

Step 3. add this snippet to the new file ".babelrc"

{
"presets": ["next/babel"]
}

Step 4, you need to run this command as steps 1-3 will remove SWC failed to load error but you will notice another error when you run the build command. So run this too

npm install next@canary

hope this helps

Solution 3:^[3]

If you use Docker, just add RUN npm install -D @swc/cli @swc/core to Dockerfile.

Solution 4:^[4]

Just run 'npm i' or 'yarn' and then restart the server.

Solution 5:^[5]

I had the same issue on Windows 11. I upgraded NodeJS to 17.0.1. After that, everything works now.

Solution 6:^[6]

i had the same problem and just work with mac/window terminal instead of VScode Integrated terminal

Solution 7:^[7]

make .babelrc in root directory. And add the following code. { "presets": ["next/babel"], "plugins": [["styled-components", { "ssr": true }]] }

Solution 8:^[8]

I use MacBook m1. And the answer by Joon Kyoung worked for me-> Delete the package-lock.json file and the node_modules directory in your project and then run npm install on your terminal.

Solution 9:^[9]

I'm a beginner with next.js and I had the same error. After searching I got a solution to add .babelrc. but using that couldn't get the features of SWC.

Today I got a real solution, using this example project command. When we create our new project, then swc will work as well as no error will be there.

command- npx create-next-app 'your_project_name' --use-npm --example "https://github.com/vercel/next-learn/tree/master/basics/learn-starter"

Let me know if you face any further issues.

Solution 10:^[10]

This error occurs because next js uses a Rust-based compiler to compile JavaScript which is much faster than babel but this is not compatible with all system architecture, in other to fix this you have to disable this compiler and use the native babel compiler. This is done by creating a .babelrc file in your root directory and adding this code below to the file;

{"presets": ["next/babel"]}

you can check out this link for more details: SWC Failed to Load - NEXTJS DOCS

Solution 11:^[11]

If you are running using Docker, I had to use node:14-buster-slim as my base image to make it work. I got the idea for my working solution from https://github.com/vercel/next.js/discussions/30468#discussioncomment-1598941.

My multi-staged Dockerfile looks like this:


############### Base Image ###############
FROM node:14-buster-slim AS base
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .

############### Build Image ###############
FROM base AS build

ARG app_env=production
ARG app_port=3000

WORKDIR /build
COPY --from=base /app ./

ENV NODE_ENV=${app_env}
ENV PORT=${app_port}
EXPOSE ${app_port}

RUN npm run build

############### Deploy Image ###############
FROM node:14.18.1-alpine AS production

ARG app_env=production
ENV NODE_ENV=${app_env}
WORKDIR /app
COPY --from=build /build/package*.json ./
COPY --from=build /build/.next ./.next
COPY --from=build /build/public ./public
RUN npm install next

EXPOSE 3000
CMD npm run start

If you want to use docker-compose to run your services, the docker-compose.yaml file for running the next dev will look something like this:

version: "3"

services:
  web-server:
    env_file:
      - ./.env
    build:
      context: .
      dockerfile: Dockerfile
      target: base
    command: npm run dev
    container_name: web-server
    restart: always
    volumes:
      - ./:/app
      - /app/node_modules
    ports:
      - "${NODEJS_PORT}:3000"

Solution 12:^[12]

Remove node_modules directory and package-lock.json

Run npm i to install the dependencies

If you are on MAC OS, you can directly run below command in terminal

rm -rf node_modules && rm package-lock.json && npm i

Solution 13:^[13]

In your NextJS Project you have this file , named .eslintrc.json, In this file

You have following code

{
  "extends": "next/core-web-vitals"
}

Replace it with

{  
   "extends": ["next/babel","next/core-web-vitals"]
}

Solution 14:^[14]

if you read the docs (170https://nextjs.org/docs/messages/failed-loading-swc) it says you need a distributable file which i downloaded at https://docs.microsoft.com/en-US/cpp/windows/latest-supported-vc-redist?view=msvc- this worked for me

Solution 15:^[15]

Just Download Redistributable C++ 2015

Solution 16:^[16]

The best way to fixed this problem on Windows is install "Microsoft Visual C++ Redistributable"

The error is occurring because Next.js is using Rust-based compiler SWC to compile JavaScript/TypeScript now and for this SWC requires a binary be downloaded that is compatible specific to your system.

To Solve this problem :

Just go to Microsoft Visual C++ Redistributable to download latest supported Microsoft Visual C++ Redistributable.

Or, you can simply download from here (please check your version first)

Permalink for latest supported x64 version

The X64 Redistributable package contains both ARM64 and X64 binaries. This package makes it easy to install required Visual C++ ARM64 binaries when the X64 Redistributable is installed on an ARM64 device.

Permalink for latest supported x86 version

Permalink for latest supported ARM64 version

Solution 17:^[17]

This is Happen because of you have uninstalled npm modules or yarn in your project Just Run this command / install node packages you will get your back

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	ouflak
Solution 2
Solution 3	Konstantin Chemshirov
Solution 4	Webby Wolf
Solution 5	Jeremy Caney
Solution 6	reza sobhgol
Solution 7	Milan Korangi
Solution 8	Roshan Dash
Solution 9	JW Geertsma
Solution 10	Rex Omiv
Solution 11	Amirsalar
Solution 12	Yves Boutellier
Solution 13	Alaeddine
Solution 14	maesstro
Solution 15	Bigpatty
Solution 16	SD Shuvo
Solution 17	Preetham Nayak

'Next failed to load SWC binary

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Solution 5:[5]

Solution 6:[6]

Solution 7:[7]

Solution 8:[8]

Solution 9:[9]

Solution 10:[10]

Solution 11:[11]

Solution 12:[12]

Solution 13:[13]

Solution 14:[14]

Solution 15:[15]

Solution 16:[16]

Solution 17:[17]