I am still new to React and I started writing a static website using Nextjs. But when I want to deploy to AWS S3 I have some problems. I used to use webpack only and when I type yarn build I get a dist file and it is easy for me to just upload the content inside the dist file to the S3 bucket.

However after using Nextjs for SSR I found that after I build the project I get a .next file with cache, server, and static subfiles as well as BUILD_ID, build-manifest.json, react-loadable-manifest.json,records.json. I have no clue what I should upload to S3 and what those files mean.

It may be a silly question but I have already spent more than a day trying to find the solution.

I am still new to React and I started writing a static website using Nextjs. But when I want to deploy to AWS S3 I have some problems. I used to use webpack only and when I type yarn build I get a dist file and it is easy for me to just upload the content inside the dist file to the S3 bucket.

However after using Nextjs for SSR I found that after I build the project I get a .next file with cache, server, and static subfiles as well as BUILD_ID, build-manifest.json, react-loadable-manifest.json,records.json. I have no clue what I should upload to S3 and what those files mean.

It may be a silly question but I have already spent more than a day trying to find the solution.

• javascript
• reactjs
• amazon-web-services
• next.js

• You also need to use next export after building. nextjs/docs#static-html-export – HMilbradt Commented Oct 20, 2019 at 4:00
• in my package.json, "scripts": { "dev": "node index.js", "build": "next build", "start": "NODE_ENV=production node index.js" }, when I yarn export or next export.It just shows an error – Ken Commented Oct 20, 2019 at 4:03
• 1 S3 is a file hosting service. You cannot use SSR with it, and instead need to statically generate (see the link), or host on a server (EC2 for example) – HMilbradt Commented Oct 20, 2019 at 4:05
• I added nextjs framework in my old project which is already deployed in S3 so that's why I want to replace my old dist content in my S3 bucket. I have added "export": "npm run build && next export" in my package.json and type yarn export but there are no any html file – Ken Commented Oct 20, 2019 at 4:10
• when I run the script yarn export ,It gives me ''Error: Cannot export when target is not server. err.sh/zeit/next.js/next-export-serverless'' – Ken Commented Oct 20, 2019 at 4:21

2 Answers 2

You can change package.json as follows.

"build": "next build && next export",

Then, you can run "yarn build". It will generate top-level directory /out in your project. Upload all contents in the folder by using the mand for convenience.

aws s3 sync ./out s3://your-s3-bucket-name

Make sure you have set your bucket to serve static website and have the following bucket policy.

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": {
                "AWS": "*"
            },
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::your-bucket-name/*"
        },
    ]
}

Original question is very old, if you arrived here using a search, and receive Error: Cannot export when target is not server - make sure you remove target target: 'serverless' from next.config.js

Otherwise, follow the answer above from @R.Cha https://stackoverflow./a/62465471/13749957 which summarizes the docs here and adds S3 specific steps - https://nextjs/docs/advanced-features/static-html-export