I fixed the issue by moving everything into an Assets folder. I kept the folder structure the same so... assets/images, assets/javascript and assets/stylesheets. I assume it is just a requirement for amplify that assets are located in an assets folder.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/919a47ba-183b-4952-b030-a1acabc4144f/2021-03-22_03.49.32_github.com_908dc82d2096.png

Attribution

How to deploy static HTML webpage on AWS Amplify?

Answer from stackoverflow user radleylewis

I came across this same issue. The issue is that your assets (in your example ./images, but I just have an assets folder, that could have images/css or whatever) might not be reachable from the directory in your AWS Amplify Build settings - at least that was my issue.

Say you have the following Build Settings:

version: 1
frontend:
  phases:
    # IMPORTANT - Please verify your build commands
    build:
      commands: []
  artifacts:
    # IMPORTANT - Please verify your build output directory
    baseDirectory: blog
    files:
      - '**/*'
  cache:
    paths: []

I placed my assets folder in the base directory, which allowed the index.html to read the location of the assets. For example in your index.html code:

<!DOCTYPE html>
<html lang="en">
<head>
   ... relevant meta tags etc here
   <link rel="stylesheet" href="./assets/styles.css">
</head>
<body>
</body>
</html>

Note

Icon created by fontawsome and used with no changes. Here is a link to the license.