Unable to deploy my NextJS Typescript application via AWS Amplify

Question

hello everyone,

i'm unable to deploy my NextJS application written in Typescript to AWS Amplify. the application works locally without an issue. the GitHub repository i'm using is a monorepo and i'm using terraform to deploy, where my frontend code is in folder "client" and i've set the following amplify.yml file:

```
version: 1

applications:
  - appRoot: client
    frontend:
      phases:
        preBuild:
          commands:
            - npm install typescript @types/node
            - npm ci
        build:
          commands:
            - npm install
            - npm run build
      artifacts:
        baseDirectory: .next
        files:
          - '**/*'
      cache:
        paths:
          - node_modules/**/*
```
pretty simple, almost a copy-paste from the docs: https://docs.aws.amazon.com/amplify/latest/userguide/deploy-nextjs-app.html

please notice the command "npm install typescript @types/node" - it is important for the following reason.

prebuild and build commands run successfully, but then at the end i get the following error message:
"It looks like you're trying to use TypeScript but do not have the required package(s) installed. Please install typescript and @types/node by running: pnpm install --save-dev typescript @types/node. If you are not trying to use TypeScript, please remove the tsconfig.json file from your package root (and any TypeScript files in your app and pages directories)."

i'm very confused by this message because as you can see, i've specifically installed those dependencies and it still fails. 
let me know if i can provide any additional information. thanks in advance!

Matia Rašetina · Accepted Answer

i've found the solution, i've set NODE_ENV environment variable to "production", which broke the build. as soon as i removed the environment variable, it worked right away!

re:Post Agent · Answer

Based on your issue with deploying a NextJS TypeScript application on AWS Amplify, I can see a few potential problems with your configuration.

First, there appears to be a discrepancy in your build process. While you're installing TypeScript and @types/node in the preBuild phase, the error suggests these packages aren't being properly recognized during the deployment process. This could be because:

1. The packages are being installed in the preBuild phase, but the build system might be checking for TypeScript before these commands complete.

2. You're running both `npm ci` and `npm install` in your build process, which might be causing conflicts. The `npm ci` command is designed to install dependencies exactly as specified in your package-lock.json, while `npm install` might modify them.

Here are some suggestions to fix this issue:

1. Modify your amplify.yml to ensure TypeScript dependencies are properly installed:
```
version: 1

applications:
- appRoot: client
frontend:
phases:
preBuild:
commands:
- npm ci
build:
commands:
- npm run build
artifacts:
baseDirectory: .next
files:
- '**/*'
cache:
paths:
- node_modules/**/*
```

2. Make sure TypeScript and @types/node are included in your package.json as devDependencies rather than trying to install them during the build process.

3. Verify that your tsconfig.json is properly configured and located in the correct directory (in the client folder).

4. If you're using a monorepo setup, ensure that your TypeScript configuration is properly set up for the client application specifically.

The error message suggests that Amplify is looking for TypeScript dependencies but can't find them, despite your attempt to install them during the build process. By including these dependencies directly in your package.json, you can ensure they're properly installed and recognized during the build.  
**Sources**  
[my amplify deploy app problem | AWS re:Post](https://repost.aws/questions/QUU6aMtIrpTsGJeGbVXjAmcA/my-amplify-deploy-app-problem)  
[Maximum schema version supported is 43.x.x, but found 45.0.0 - Amplify Sandbox Deployment Error | AWS re:Post](https://repost.aws/questions/QUdcBaCBvlTD2rplY_9if56Q/maximum-schema-version-supported-is-43-x-x-but-found-45-0-0-amplify-sandbox-deployment-error)

Unable to deploy my NextJS Typescript application via AWS Amplify

Add your answer

Relevant content