Cannot find file '../aws-exports'

[trevorallred]

Describe the bug When I try to build my application remotely, it fails do to the following error:

2019-03-04T17:16:13.489Z [INFO]: $ react-scripts build
2019-03-04T17:16:14.796Z [INFO]: Creating an optimized production build...
2019-03-04T17:16:21.183Z [INFO]: Failed to compile.
2019-03-04T17:16:21.184Z [INFO]: ./src/pages/amplify.js
Cannot find file '../aws-exports' in './src/pages'.

To Reproduce Steps to reproduce the behavior:

1. Create a react js application
2. Initialize the application with amplify init
3. Notice init creates the src/aws-exports.js file and correctly adds it to the .gitignore file
4. Add this code to your App.js file.

   import Amplify from 'aws-amplify';
   import aws_exports from '../aws-exports';
   Amplify.configure(aws_exports);

5. Run the application locally. It works correctly.
6. Run amplify push
7. Look at the Frontend build output and notice it fails to build

Expected behavior To configure Amplify, the documentation explains that you should reference a file called aws-exports.js. This works fine locally because it's created locally. But when I commit the file and pull it from the repo, the build complains that it's not there. The docs don't explain where this file should be remotely and how you can refer to a file locally yet not check it in.

Additional Info There seem to be some hints about what's happening in the Provisioning step

HEAD is now at 7b8a433... add environment var for api and fix index
2019-03-04T17:16:11.041Z [INFO]: Retrieving environment cache...

I think that remotely, it's adding in the aws-exports file somewhere but it's possible it's in a different location, which is why my import can't find the file.

[swaminator]

@trevorallred what are you using to build your app remotely?

[ahummel25]

Any clarity around this and how to use aws-exports file remotely? Since it's in .gitignore, how do we access it when deploying code?

[kaustavghosh06]

You should run amplify init as the first step to re-create the aws-exports.js file and then run your frontend build. This is what we do at the backend build step in Amplify console.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale[bot]]

This issue has been automatically closed because of inactivity. Please open a new issue if are still encountering problems.

[charlesfayal]

You should run amplify init as the first step to re-create the aws-exports.js file and then run your frontend build. This is what we do at the backend build step in Amplify console.

Does this mean it should be in the prebuild for the front end?

[jviaches]

I am also wondering the same question as @ahummel25 . Does anyone can shed a light on it ?

[trevorallred]

I was able to finally resolve this but it was a while ago so I don't fully remember the details. I'll try to explain below.

aws-exports.js is a file that gets created by amplify init and has basic settings like what AWS region, Cognito Identity Pool to use, and more. This would be different for each environment (like dev and prod). This changes each time you change the amplify environment. So you don't want to check this file in since it has all the environment config data.

When you build your Amplify app remotely in AWS, something automatically creates this file and puts it into the root deployed folder. Locally, this means the file is in my ./src folder next to my index.tsx file. So I reference like this:

import config from './aws-exports';

Since this issue keeps coming up, I think the documentation should be updated. The "magic" creation of aws-exports when deploying your app on AWS Amplify needs further clarification.

[jviaches]

@trevorallred thanks for explanation. Just to clarify, you do not commit this file to repository ? So when you build it on AWS, it creates this file automatically depending on environment ? Do you need amplify init command in your deploy scripts ?

[ph0ph0]

@trevorallred @kaustavghosh06 @swaminator any advice on this? I am facing the same error when deploying via Netlify

[GaganBhat]

Agreed, I just pushed and it seems to fail to build my app on AWS amplify because it doesn't run init by default. Clarity on how to resolve this would be helpful.

[GaganBhat]

@ph0ph0 @jviaches https://stackoverflow.com/questions/59708481/aws-amplify-deploy-failure-due-to-aws-exports

This StackOverflow post has multiple solutions for now on how to fix this.

[romainbraud]

The issue still not solved ...

[willtpwise]

Definitely not resolved. I found this particularly painful after following this doc on the Amplify site for running Multiple frontends under the same backend.

[moekaddour]

Make sure aws-exports.js not ignored by .gitignore in your repo. this will fix the problem

[jaivinodha]

Make sure aws-exports.js not ignored by .gitignore in your repo. this will fix the problem

Im also getting the same error. It contains sensitive information . how can we ignore that ?

[moekaddour]

Hi @jaivinodha, I agree about the sensitive info. so it's highly recommended to push to private repo. before doing that.

[SankarBeTheGeek]

Resolved this issue with following steps

1. Change my repo as Private
2. Commented the aws-exports.js line in .gitignore in ./src folder

All the best team 👍

[deagudelo]

If I comment aws-exports on gitignore and I have multiple environments, will this workaround still work?

[GaganBhat]

Here's a possible suggestion for the devs, instead of requiring us to push the sensitive file into the repository, there could be a section on the aws amplify dashboard to upload our aws-exports.js configuration securely. This way there's no sensitive data exposed and is stored securely on amazon's servers.

Alternatively, allow us to use AWS Secrets Manager for the sensitive tokens/keys in the config file.

[swyxio]

for clarity - aws-exports.js does not contain sensitive info - it is all intended to be exposed to the frontend, by definition it is not sensitive.

BUT it is gitignored because we dont want people accidentally using the wrong configs between different environments so it should be generated from scratch every time. Amplify Console does this for you, as @kaustavghosh06 said above.

i would recommend opening a new issue with exact repro if you face this error. i personally have started to record my screen to serve as a very effective form of bug report. may not be productive to simply +1 here if your situation is different from OP. i agree docs can be better on aws-exports.js and suggest making a new version of this PR

[swyxio]

there is also new documentation for all autogenerated files here https://github.com/aws-amplify/docs/pull/2328/files#diff-f713e81b8903b8f62ee14b271adccbb2R74 but i continue to believe we should insert some comments inside the file as not everyone will read the documentation.

[JtawRobot]

Same issue

[Seijuro256]

So is there any viable solution? Im doing the tutorial Build a "Full-Stack React Application" and I'm getting this exact error at module 3 after adding authentication and commiting the live changes via git.

[ghost]

Same issue: I followed the tutorial Build a "Full-Stack React Application" letter-for-letter, and and I'm also getting this exact same error at module 3 - after adding authentication and committing the changes via git.

Not cool, AWS. Not cool.

[mormsbee]

Same issue. and were running fine up until this past thursday. cant push any code to upper environments as we are seeing this issue on some of our testing environments. Seems like for us, something changed on Wednesday night...

[swaminator]

Apologies @Trevor-mc2 . We fixed the tutorial here: https://aws.amazon.com/getting-started/hands-on/build-react-app-amplify-graphql/module-three/. Search for 'Set up CI/CD of the frontend and backend`.

For those of you who are encountering a similar issue, check out the tutorial

[sportograf]

@swaminator must be done in the german versions as well e.g. https://aws.amazon.com/de/getting-started/hands-on/build-react-app-amplify-graphql/

[duncangroenewald]

@swaminator - I don't understand what part of the tutorial is relevant - as far as I can tell things were running fine until recently and now we get this error "Cannot find file './aws-exports' in './src'." when committing code to the CodeCommit repo.

Why is this file not being created by the Amplify CI/CD process? Is there some change we are required to make to the configuration.

[shubhamsharma98]

last comment from @swaminator worked for me. The backend needs to be build first which will result in the export file that the frontend build needs. Since the backend build steps are missing from build settings, the export file never gets generated and hence the frontend build fails saying it can't find the export file. No need to push your frontend export file to Git. Instead go to your Amplify console's build setting and under App build specification, add the backend build step in the yml spec above the frontend build steps like this:

backend:
  phases:
    build:
      commands:
        - '# Execute Amplify CLI with the helper script'
        - amplifyPush --simple
frontend:

[SH4DY]

Something is still off here. I followed the updated tutorial and I updated the build config in amplify.yml accordingly. Now I see the following error caused by the amplifyPush script during build:

# Importing Amplify environment: master (amplify env import) 2020-10-15T08:05:58.784Z [WARNING]: /root/.nvm/versions/node/v10.16.0/lib/node_modules/@aws-amplify/cli/node_modules/gluegun/build/index.js:13 throw up; ^ Error: You are not working inside a valid amplify project. Use 'amplify init' in the root of your app directory to initialize your project with Amplify

I don't know how to trace this error because this is being run on a Docker container fully managed by Amplify. I can kind of reproduce this error message locally when I run amplify env import in my build directory, similar to what should be happing on the Docker container.

[mauerbac]

I was able to reproduce this using the aws-amplify-quicknotes sample app from Amplify console. I get

2020-10-15T15:30:52.937Z [INFO]: ./src/index.js
                                 Cannot find file './aws-exports' in './src'.

[insanetron75]

This issue is still un-resolved

I tried adding a amplify pull command to my frontend pre-build however the console hung and I eventually cancelled the build.

For now I shall be adding the aws-config.js file to my repo however I really don't like that.

[zono]

I think this issue is still un-resolved.

backend:
  phases:
    build:
      commands:
        - '# Execute Amplify CLI with the helper script'
        - amplifyPush --simple
frontend:

I tried the above way but I got the following error. I don't think creating stack is correct way.

/Buildsession is not authorized to perform: cloudformation:CreateStack on resource... 

As a workaround, I committed aws-exports.js for each environment and renamed it in amplify.yml.

frontend:
  phases:
    build:
      commands:
        - mv src/aws-exports.dev.js src/aws-exports.js

[bjwyse]

Someone with in depth knowledge of the tutorial needs to run through https://aws.amazon.com/getting-started/hands-on/build-react-app-amplify-graphql/ from scratch and check that the sequence of steps is correct.

I found that in Module 3, it was necessary to perform the 'Setup CI/CD' step, and then do amplify pull in order to get the necessary aws-exports.js file which then allowed me to perform the 'Run the app locally' step. As it stands, following the steps in order does not work.

[Ronald03]

I was able to get my code to redeploy by following a workaround listed above. I changed my git repo to Private then commented in '.gitignore' the line for aws-exports.js, pushed the code so the file get commited. I removed the advised piece from Module 3 (setup CI/CD) [https://aws.amazon.com/getting-started/hands-on/build-react-app-amplify-graphql/module-three/] and then redeploy the app from Amplify Console. My code was able to get redeployed and my backend works as expected. I just did this 5 minutes ago.

[braian125]

avoid importing ./aws-exports in index as long as you don't have an api configured, this way it won't fail.

I comment the lines to configure Amplify in my project while I do not need them and build without errors

[chrisbonifacio]

Because the aws-exports file is not supposed to be tracked by git and/or pushed, the deployment process needs to run amplify init and create the file.

In the AWS Console, navigate to your Amplify app Click on Build settings

This is the full script that should be in App build specification

backend:
  phases:
    build:
      commands:
        - '# Execute Amplify CLI with the helper script'
        - amplifyPush --simple
frontend:
  phases:
    preBuild:
      commands:
        - yarn install
    build:
      commands:
        - yarn run build
  artifacts:
    baseDirectory: /build
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

Lastly, make sure that under Build image settings you set the Amplify CLI version to latest

Hopefully this helps.

[gruckionvit]

What if we are using a different CICD pipeline say Azure? I need to use something else as you can't select a macOS build image, my product is a react native application.

[aaronkik]

I added an - ls command before my - amplifyPush --simple and realised the amplify folder was not in the current directory as my frontend was setup as a monorepo when setting up amplify.

I had to do:

backend:
  phases:
    build:
      commands:
        - cd ../<amplify_folder_location> 
        - amplifyPush --simple
        - cd <my_frontend_location>
frontend:
 ...

[rideddy84]

Because the aws-exports file is not supposed to be tracked by git and/or pushed, the deployment process needs to run amplify init and create the file.

In the AWS Console, navigate to your Amplify app Click on Build settings

This is the full script that should be in App build specification

backend:
  phases:
    build:
      commands:
        - '# Execute Amplify CLI with the helper script'
        - amplifyPush --simple
frontend:
  phases:
    preBuild:
      commands:
        - yarn install
    build:
      commands:
        - yarn run build
  artifacts:
    baseDirectory: /build
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

Lastly, make sure that under Build image settings you set the Amplify CLI version to latest

Hopefully this helps.

In my case amplifyPush --simple worked well. But it would be better if it could skip actual push operation. It looks like wasting.

[alivedise]

The design of aws-exports pollutes my monorepo. Just one of my repo is amplify-based, but everyone in the monorepo who does not care about the amplify frontend repo also needs the aws account to generate the aws-exports; otherwise it stops the build process. Since you say it's not sensitive, it should not ignored by gitignore. "Config due to environment difference" is not a good explanation.

It'd been a long time I am disappointed at intergrating 3rd party libraries. Not every frontend project is using your solution. Not every person is WORKING on CI/CD. We all know can automate generating aws-exports on CI/CD, but real person is working on his/her computer. I don't understand why you have to suddenly insert a json which is gitignored in the repo.

I don't know if you know 'monorepo' or not. It could be a whole company's project. Some of the projects are not overlapped. Some of those is using common components which will affect the frontend project is using amplify. The developer who is working on common components won't have the aws account to generate aws-exports on his/her own to test if the change to common component will affect the frontend project based on amplify. This is a really not smart idea.

[evcodes]

Hello everyone!

I was running into the same issue with an older project. My project was only using api and hosting so it might be a lot simpler than many projects using e2e test, multiple environments, etc.

To solve this, I disconnected my branch, reconnected it and ran through an IAM Role creation prompt. Then you can attach the new role to your project and it will should allow you to redeploy your application, here is the amplify.yml file for the build command.

version: 1
backend:
  phases:
    build:
      commands:
        - '# Execute Amplify CLI with the helper script'
        - amplifyPush --simple
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run build
  artifacts:
    baseDirectory: build
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

[dsebata]

Hi everyone. I was experiencing the same issue on a project i'm working on, after looking around i noticed the - amplifyPush --simple command generates this file in the location specified by "SourceDir": "src" in the the amplify/.config/project-config.json file.

[LachlanKI]

Hi everyone. I was experiencing the same issue on a project i'm working on, after looking around i noticed the - amplifyPush --simple command generates this file in the location specified by "SourceDir": "src" in the the amplify/.config/project-config.json file.

If like me you accidently chose the wrong location for 'src' (when amplify initing) then you will be able to see it here. To resolve it I didnt change this JSON (can't say it does or does not work to do so) but instead, deleted my amplify repo, re cloned and re specified the right location.

[xeontem]

Without "backend" section CI use "default" backend section config.

Should manually configure backend build steps if to add backend section, similar to default config.

Frontend build may start failing(absent aws-exports file), due to incorrect backend section config.

[saikiranchalla1]

I was able to get this working by updating the tsconfig.json to allow JS as below:

 "compilerOptions": {
    "allowJs": true,
}

it is in the documentation too: Depending on your TypeScript version you may need to rename aws-exports.js to aws-exports.ts prior to importing, or enable the allowJs compiler option in your tsconfig. https://docs.amplify.aws/start/getting-started/data-model/q/integration/angular/#connect-frontend-to-api

[jpmamuric]

This might help.

https://docs.aws.amazon.com/amplify/latest/userguide/amplify-config-autogeneration.html

[arstrel]

I had the same issue. Front end build fails with Cannot find file './aws-exports' in './src' I tried unticking Enable full-stack continuous deployments (CI/CD) checkbox in Edit of "Continuous deploys set up" I tried adding this to Build settings amplify.yml file

backend:
  phases:
    build:
      commands:
        - '# Execute Amplify CLI with the helper script'
        - amplifyPush --simple

I tried adding "allowJs": true, to jsconfig / tsconfig files and all sorts of other things that I could find online

What helped me was to set Node.js version to 14 App settings => Build settings => Build image settings => Edit => Add package version override I set it to 16 and started having this issue, set it to 14 and life was good again.

Currently my build specification does not have backend instructions and is like this

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - yarn install
    build:
      commands:
        - yarn run build
  artifacts:
    baseDirectory: build
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

Checkbox of Enable full-stack continuous deployments (CI/CD) is Checked .gitignore has aws-exports.js in it

That is a working configuration for me

[Tris-909]

How could this problem be closed ? I read through the whole issue and can't find a proper answer. This happens to me multiple times when I build Frontend using deployment on AWS Amplify Console. This is my build. Even if I were to commit the aws-exports.js into Github. Switching between dev and prod env is an issue since this gets updated all the time and I have to include it in the commit every time I want to do a deployment.

version: 1
backend:
  phases:
    build:
      commands:
        - '# Execute Amplify CLI with the helper script'
        - amplifyPush --simple
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - echo "REACT_APP_GOOGLE_CLIENT_ID=$REACT_APP_GOOGLE_CLIENT_ID" >> .env
        - npm run build
  artifacts:
    baseDirectory: build
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*